aboutsummaryrefslogtreecommitdiff
path: root/src/client/util/SharingManager.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/util/SharingManager.tsx')
-rw-r--r--src/client/util/SharingManager.tsx496
1 files changed, 322 insertions, 174 deletions
diff --git a/src/client/util/SharingManager.tsx b/src/client/util/SharingManager.tsx
index 127ee33ce..bec6b973b 100644
--- a/src/client/util/SharingManager.tsx
+++ b/src/client/util/SharingManager.tsx
@@ -1,7 +1,7 @@
import { observable, runInAction, action } from "mobx";
import * as React from "react";
import MainViewModal from "../views/MainViewModal";
-import { Doc, Opt, DocCastAsync } from "../../fields/Doc";
+import { Doc, Opt, DocCastAsync, DocListCast } from "../../fields/Doc";
import { DocServer } from "../DocServer";
import { Cast, StrCast } from "../../fields/Types";
import * as RequestPromise from "request-promise";
@@ -9,7 +9,6 @@ import { Utils } from "../../Utils";
import "./SharingManager.scss";
import { Id } from "../../fields/FieldSymbols";
import { observer } from "mobx-react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { library } from '@fortawesome/fontawesome-svg-core';
import * as fa from '@fortawesome/free-solid-svg-icons';
import { DocumentView } from "../views/nodes/DocumentView";
@@ -17,8 +16,11 @@ import { SelectionManager } from "./SelectionManager";
import { DocumentManager } from "./DocumentManager";
import { CollectionView } from "../views/collections/CollectionView";
import { DictationOverlay } from "../views/DictationOverlay";
-import GroupManager from "./GroupManager";
+import GroupManager, { UserOptions } from "./GroupManager";
import GroupMemberView from "./GroupMemberView";
+import Select from "react-select";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { List } from "../../fields/List";
library.add(fa.faCopy);
@@ -28,36 +30,44 @@ export interface User {
}
export enum SharingPermissions {
- None = "Not Shared",
- View = "Can View",
+ Edit = "Can Edit",
Add = "Can Add",
- Edit = "Can Edit"
+ View = "Can View",
+ None = "Not Shared"
}
-const ColorMapping = new Map<string, string>([
- [SharingPermissions.None, "red"],
- [SharingPermissions.View, "maroon"],
- [SharingPermissions.Add, "blue"],
- [SharingPermissions.Edit, "green"]
-]);
-
-const HierarchyMapping = new Map<string, string>([
- [SharingPermissions.None, "0"],
- [SharingPermissions.View, "1"],
- [SharingPermissions.Add, "2"],
- [SharingPermissions.Edit, "3"],
-
- ["0", SharingPermissions.None],
- ["1", SharingPermissions.View],
- ["2", SharingPermissions.Add],
- ["3", SharingPermissions.Edit]
-
-]);
+// const ColorMapping = new Map<string, string>([
+// [SharingPermissions.None, "red"],
+// [SharingPermissions.View, "maroon"],
+// [SharingPermissions.Add, "blue"],
+// [SharingPermissions.Edit, "green"]
+// ]);
+
+// export const HierarchyMapping = new Map<string, number>([
+// [SharingPermissions.None, 0],
+// [SharingPermissions.View, 1],
+// [SharingPermissions.Add, 2],
+// [SharingPermissions.Edit, 3]
+
+// // ["0", SharingPermissions.None],
+// // ["1", SharingPermissions.View],
+// // ["2", SharingPermissions.Add],
+// // ["3", SharingPermissions.Edit]
+
+// ]);
+
+interface GroupOptions {
+ label: string;
+ options: UserOptions[];
+}
const SharingKey = "sharingPermissions";
const PublicKey = "publicLinkPermissions";
const DefaultColor = "black";
+const groupType = "!groupType/";
+const indType = "!indType/";
+
interface ValidatedUser {
user: User;
notificationDoc: Doc;
@@ -70,17 +80,20 @@ export default class SharingManager extends React.Component<{}> {
public static Instance: SharingManager;
@observable private isOpen = false;
@observable private users: ValidatedUser[] = [];
- @observable private groups: Doc[] = [];
+ // @observable private groups: Doc[] = [];
@observable private targetDoc: Doc | undefined;
@observable private targetDocView: DocumentView | undefined;
@observable private copied = false;
@observable private dialogueBoxOpacity = 1;
@observable private overlayOpacity = 0.4;
- @observable private groupToView: Opt<Doc>;
+ @observable private selectedUsers: UserOptions[] | null = null;
+ @observable private permissions: SharingPermissions = SharingPermissions.Edit;
+ @observable private sharedUsers: ValidatedUser[] = [];
+ @observable private sharedGroups: Doc[] = [];
- private get linkVisible() {
- return this.sharingDoc ? this.sharingDoc[PublicKey] !== SharingPermissions.None : false;
- }
+ // private get linkVisible() {
+ // return this.sharingDoc ? this.sharingDoc[PublicKey] !== SharingPermissions.None : false;
+ // }
public open = (target: DocumentView) => {
SelectionManager.DeselectAll();
@@ -89,12 +102,12 @@ export default class SharingManager extends React.Component<{}> {
this.targetDoc = target.props.Document;
DictationOverlay.Instance.hasActiveModal = true;
this.isOpen = true;
- if (!this.sharingDoc) {
- this.sharingDoc = new Doc;
- }
+ // if (!this.sharingDoc) {
+ // this.sharingDoc = new Doc;
+ // }
}));
- runInAction(() => this.groups = GroupManager.Instance.getAllGroupsCopy());
+ // runInAction(() => this.groups = GroupManager.Instance.getAllGroups());
}
public close = action(() => {
@@ -107,13 +120,13 @@ export default class SharingManager extends React.Component<{}> {
}), 500);
});
- private get sharingDoc() {
- return this.targetDoc ? Cast(this.targetDoc[SharingKey], Doc) as Doc : undefined;
- }
+ // private get sharingDoc() {
+ // return this.targetDoc ? Cast(this.targetDoc[SharingKey], Doc) as Doc : undefined;
+ // }
- private set sharingDoc(value: Doc | undefined) {
- this.targetDoc && (this.targetDoc[SharingKey] = value);
- }
+ // private set sharingDoc(value: Doc | undefined) {
+ // this.targetDoc && (this.targetDoc[SharingKey] = value);
+ // }
constructor(props: {}) {
super(props);
@@ -144,77 +157,121 @@ export default class SharingManager extends React.Component<{}> {
const members: string[] = JSON.parse(StrCast(group.members));
const users: ValidatedUser[] = this.users.filter(user => members.includes(user.user.email));
- const sharingDoc = this.sharingDoc!;
- if (permission === SharingPermissions.None) {
- const metadata = sharingDoc[StrCast(group.groupName)];
- if (metadata) sharingDoc[StrCast(group.groupName)] = undefined;
+ const target = this.targetDoc!;
+ const ACL = `ACL-${StrCast(group.groupName)}`;
+
+ target[ACL] = permission;
+
+ group.docsShared ? Doc.IndexOf(target, DocListCast(group.docsShared)) === -1 && (group.docsShared as List<Doc>).push(target) : group.docsShared = new List<Doc>([target]);
+
+ users.forEach(({ notificationDoc }) => {
+
+ if (permission !== SharingPermissions.None) Doc.IndexOf(target, DocListCast(notificationDoc[storage])) === -1 && Doc.AddDocToList(notificationDoc, storage, target);
+ else Doc.IndexOf(target, DocListCast(notificationDoc[storage])) !== -1 && Doc.RemoveDocFromList(notificationDoc, storage, target);
+
+ });
+ }
+
+ shareWithAddedMember = (group: Doc, email: string) => {
+ const user: ValidatedUser = this.users.find(user => user.user.email === email)!;
+
+ if (group.docsShared) {
+ DocListCast(group.docsShared).forEach(doc => Doc.IndexOf(doc, DocListCast(user.notificationDoc[storage])) === -1 && Doc.AddDocToList(user.notificationDoc, storage, doc));
}
- else {
- sharingDoc[StrCast(group.groupName)] = permission;
+ }
+
+ removeMember = (group: Doc, email: string) => {
+ const user: ValidatedUser = this.users.find(user => user.user.email === email)!;
+
+ if (group.docsShared) {
+ DocListCast(group.docsShared).forEach(doc => Doc.IndexOf(doc, DocListCast(user.notificationDoc[storage])) !== -1 && Doc.RemoveDocFromList(user.notificationDoc, storage, doc));
}
+ }
- users.forEach(user => {
- this.setInternalSharing(user, permission, group);
- });
+ removeGroup = (group: Doc) => {
+ if (group.docsShared) {
+ DocListCast(group.docsShared).forEach(doc => {
+ const ACL = `ACL-${StrCast(group.groupName)}`;
+ doc[ACL] = "Not Shared";
+
+ const members: string[] = JSON.parse(StrCast(group.members));
+ const users: ValidatedUser[] = this.users.filter(user => members.includes(user.user.email));
+
+ users.forEach(user => Doc.RemoveDocFromList(user.notificationDoc, storage, doc));
+ });
+ }
}
- setInternalSharing = async (recipient: ValidatedUser, state: string, group: Opt<Doc>) => {
+ setInternalSharing = (recipient: ValidatedUser, permission: string) => {
const { user, notificationDoc } = recipient;
const target = this.targetDoc!;
- const manager = this.sharingDoc!;
- const key = user.userDocumentId;
-
- let metadata = await DocCastAsync(manager[key]);
- const permissions: { [key: string]: number } = metadata?.permissions ? JSON.parse(StrCast(metadata.permissions)) : {};
- permissions[StrCast(group ? group.groupName : Doc.CurrentUserEmail)] = parseInt(HierarchyMapping.get(state)!);
- const max = Math.max(...Object.values(permissions));
-
- // let max = 0;
- // const keys: string[] = [];
- // for (const [key, value] of Object.entries(permissions)) {
- // if (value === max && max !== 0) {
- // keys.push(key);
- // }
- // else if (value > max) {
- // keys.splice(0, keys.length);
- // keys.push(key);
- // max = value;
- // }
- // }
+ // const manager = this.sharingDoc!;
+ const key = user.email.replace('.', '_');
+ // const key = user.userDocumentId;
- switch (max) {
- case 0:
- if (metadata) {
- const sharedAlias = (await DocCastAsync(metadata.sharedAlias))!;
- Doc.RemoveDocFromList(notificationDoc, storage, sharedAlias);
- manager[key] = undefined;
- }
- break;
-
- case 1: case 2: case 3:
- if (!metadata) {
- metadata = new Doc;
- const sharedAlias = Doc.MakeAlias(target);
- Doc.AddDocToList(notificationDoc, storage, sharedAlias);
- metadata.sharedAlias = sharedAlias;
- manager[key] = metadata;
- }
- metadata.permissions = JSON.stringify(permissions);
- // metadata.usersShared = JSON.stringify(keys);
- break;
- }
+ const ACL = `ACL-${key}`;
- if (metadata) metadata.maxPermission = HierarchyMapping.get(`${max}`);
- }
+ // const permissions: { [key: string]: number } = target[ACL] ? JSON.parse(StrCast(target[ACL])) : {};
- private setExternalSharing = (state: string) => {
- const sharingDoc = this.sharingDoc;
- if (!sharingDoc) {
- return;
+ target[ACL] = permission;
+
+
+ if (permission !== SharingPermissions.None) {
+ !this.sharedUsers.includes(recipient) && this.sharedUsers.push(recipient);
+
+ Doc.IndexOf(target, DocListCast(notificationDoc[storage])) === -1 && Doc.AddDocToList(notificationDoc, storage, target);
+ }
+ else {
+ const index = this.sharedUsers.findIndex(user => user === recipient);
+ index !== -1 && this.sharedUsers.splice(index, 1);
+ Doc.IndexOf(target, DocListCast(notificationDoc[storage])) !== -1 && Doc.RemoveDocFromList(notificationDoc, storage, target);
}
- sharingDoc[PublicKey] = state;
+
}
+
+ // let metadata = await DocCastAsync(manager[key]);
+ // const permissions: { [key: string]: number } = metadata?.permissions ? JSON.parse(StrCast(metadata.permissions)) : {};
+ // permissions[StrCast(group ? group.groupName : Doc.CurrentUserEmail)] = parseInt(HierarchyMapping.get(permission)!);
+ // const max = Math.max(...Object.values(permissions));
+
+ // switch (max) {
+ // case 0:
+ // // if (metadata) {
+ // // const sharedAlias = (await DocCastAsync(metadata.sharedAlias))!;
+ // // Doc.RemoveDocFromList(notificationDoc, storage, sharedAlias);
+ // // manager[key] = undefined;
+ // // }
+ // Doc.RemoveDocFromList(notificationDoc, storage, target);
+ // break;
+
+ // case 1: case 2: case 3:
+
+ // Doc.AddDocToList(notificationDoc, storage, target);
+
+ // if (!metadata) {
+ // metadata = new Doc;
+ // const sharedAlias = Doc.MakeAlias(target);
+ // Doc.AddDocToList(notificationDoc, storage, target);
+ // metadata.sharedAlias = sharedAlias;
+ // manager[key] = metadata;
+ // }
+ // metadata.permissions = JSON.stringify(permissions);
+ // // metadata.usersShared = JSON.stringify(keys);
+ // break;
+ // }
+
+ // if (metadata) metadata.maxPermission = HierarchyMapping.get(`${max}`);
+
+
+ // private setExternalSharing = (permission: string) => {
+ // const sharingDoc = this.sharingDoc;
+ // if (!sharingDoc) {
+ // return;
+ // }
+ // sharingDoc[PublicKey] = permission;
+ // }
+
private get sharingUrl() {
if (!this.targetDoc) {
return undefined;
@@ -271,32 +328,137 @@ export default class SharingManager extends React.Component<{}> {
}
private computePermissions = (userKey: string) => {
- const sharingDoc = this.sharingDoc;
- if (!sharingDoc) {
- return SharingPermissions.None;
- }
- const metadata = sharingDoc[userKey] as Doc | string;
- if (!metadata) {
- return SharingPermissions.None;
- }
- return StrCast(metadata instanceof Doc ? metadata.maxPermission : metadata, SharingPermissions.None);
+ // const sharingDoc = this.sharingDoc;
+ // if (!sharingDoc) {
+ // return SharingPermissions.None;
+ // }
+ // const metadata = sharingDoc[userKey] as Doc | string;
+
+ if (!this.targetDoc) return SharingPermissions.None;
+
+ const ACL = `ACL-${userKey}`;
+ const permission = StrCast(this.targetDoc[ACL]);
+
+ // if (!metadata) {
+ // return SharingPermissions.None;
+ // }
+ return StrCast(this.targetDoc[ACL], SharingPermissions.None);
+ }
+
+ @action
+ handleUsersChange = (selectedOptions: any) => {
+ this.selectedUsers = selectedOptions as UserOptions[];
+ }
+
+ @action
+ handlePermissionsChange = (event: React.ChangeEvent<HTMLSelectElement>) => {
+ this.permissions = event.currentTarget.value as SharingPermissions;
+ }
+
+ @action
+ share = () => {
+ this.selectedUsers?.forEach(user => {
+ if (user.value.includes(indType)) {
+ console.log(user);
+ console.log(this.users.find(u => u.user.email === user.label));
+ this.setInternalSharing(this.users.find(u => u.user.email === user.label)!, this.permissions);
+ }
+ else {
+ this.setInternalGroupSharing(GroupManager.Instance.getGroup(user.label)!, this.permissions);
+ }
+ });
+ this.selectedUsers = null;
}
private get sharingInterface() {
const existOtherUsers = this.users.length > 0;
- const existGroups = this.groups.length > 0;
+ const existGroups = GroupManager.Instance?.getAllGroups().length > 0;
// const manager = this.sharingDoc!;
+ const options: GroupOptions[] = GroupManager.Instance ?
+ [
+ {
+ label: 'Individuals',
+ options: GroupManager.Instance.options.map(({ label, value }) => ({ label, value: "!indType/" + value }))
+ },
+ {
+ label: 'Groups',
+ options: GroupManager.Instance.getAllGroups().map(({ groupName }) => ({ label: StrCast(groupName), value: "!groupType/" + StrCast(groupName) }))
+ }
+ ]
+ : [];
+
+ const userListContents: (JSX.Element | null)[] = this.users.map(({ user, notificationDoc }) => { // can't use async here
+ const userKey = user.email.replace('.', '_');
+ // const userKey = user.userDocumentId;
+ const permissions = this.computePermissions(userKey);
+ // const color = ColorMapping.get(permissions);
+
+ // console.log(manager);
+ // const metadata = manager[userKey] as Doc;
+ // const usersShared = StrCast(metadata?.usersShared, "");
+ // console.log(usersShared)
+
+ return permissions === SharingPermissions.None ? null : (
+ <div
+ key={userKey}
+ className={"container"}
+ >
+ <span className={"padding"}>{user.email}</span>
+ {/* <div className={"shared-by"}>{usersShared}</div> */}
+ <div className="edit-actions">
+ <select
+ className={"permissions-dropdown"}
+ value={permissions}
+ // style={{ color, borderColor: color }}
+ onChange={e => this.setInternalSharing({ user, notificationDoc }, e.currentTarget.value)}
+ >
+ {this.sharingOptions}
+ </select>
+ </div>
+ </div>
+ );
+ });
+
+
+ const groupListContents = GroupManager.Instance?.getAllGroups().map(group => {
+ const permissions = this.computePermissions(StrCast(group.groupName));
+ // const color = ColorMapping.get(permissions);
+
+ return permissions === SharingPermissions.None ? null : (
+ <div
+ key={StrCast(group.groupName)}
+ className={"container"}
+ >
+ <span className={"padding"}>{group.groupName}</span>
+ <div className="edit-actions">
+ <select
+ className={"permissions-dropdown"}
+ value={permissions}
+ // style={{ color, borderColor: color }}
+ onChange={e => this.setInternalGroupSharing(group, e.currentTarget.value)}
+ >
+ {this.sharingOptions}
+ </select>
+ <button onClick={action(() => GroupManager.Instance.currentGroup = group)}>Edit</button>
+ </div>
+ </div>
+ );
+ });
+
+ const displayUserList = userListContents?.every(user => user === null);
+ const displayGroupList = groupListContents?.every(group => group === null);
+
return (
<div className={"sharing-interface"}>
- {this.groupToView ?
+ {GroupManager.Instance?.currentGroup ?
<GroupMemberView
- group={this.groupToView}
- onCloseButtonClick={action(() => this.groupToView = undefined)}
+ group={GroupManager.Instance.currentGroup}
+ onCloseButtonClick={action(() => GroupManager.Instance.currentGroup = undefined)}
/> :
null}
- <p className={"share-link"}>Manage the public link to {this.focusOn("this document...")}</p>
+ {/* <p className={"share-link"}>Manage the public link to {this.focusOn("this document...")}</p>
{!this.linkVisible ? (null) :
<div className={"link-container"}>
<div className={"link-box"} onClick={this.copy}>{this.sharingUrl}</div>
@@ -325,80 +487,65 @@ export default class SharingManager extends React.Component<{}> {
{this.sharingOptions}
</select>
</div>
- <div className={"hr-substitute"} />
+ <div className={"hr-substitute"} /> */}
<div className="sharing-contents">
- <div className={"individual-container"}>
- <p className={"share-individual"}>Privately share {this.focusOn("this document")} with an individual...</p>
- <div className={"users-list"} style={{ display: existOtherUsers ? "block" : "flex", minHeight: existOtherUsers ? undefined : 150 }}>{/*200*/}
- {!existOtherUsers ? "There are no other users in your database." :
- this.users.map(({ user, notificationDoc }) => { // can't use async here
- const userKey = user.userDocumentId;
- const permissions = this.computePermissions(userKey);
- const color = ColorMapping.get(permissions);
-
- // console.log(manager);
- // const metadata = manager[userKey] as Doc;
- // const usersShared = StrCast(metadata?.usersShared, "");
- // console.log(usersShared)
-
-
- return (
+ <p className={"share-title"}><b>Share </b>{this.focusOn(StrCast(this.targetDoc?.title, "this document"))}</p>
+ <div className={"close-button"} onClick={this.close}>
+ <FontAwesomeIcon icon={fa.faWindowClose} size={"lg"} />
+ </div>
+ {this.targetDoc?.author !== Doc.CurrentUserEmail ? null
+ :
+ <div className="share-setup">
+ <Select
+ className={"user-search"}
+ placeholder={"Enter user or group name..."}
+ isMulti
+ closeMenuOnSelect={false}
+ options={options}
+ onChange={this.handleUsersChange}
+ value={this.selectedUsers}
+ />
+ <select className="permissions-select" onChange={this.handlePermissionsChange}>
+ {this.sharingOptions}
+ </select>
+ <button className="share-button" onClick={this.share}>
+ Share
+ </button>
+ </div>
+ }
+ <div className="main-container">
+ <div className={"individual-container"}>
+ <div className={"users-list"} style={{ display: displayUserList ? "flex" : "block" }}>{/*200*/}
+ {
+ displayUserList ?
<div
- key={userKey}
- className={"container"}
+ className={"none"}
>
- <span className={"padding"}>{user.email}</span>
- {/* <div className={"shared-by"}>{usersShared}</div> */}
- <div className="edit-actions">
- <select
- className={"permissions-dropdown"}
- value={permissions}
- style={{ color, borderColor: color }}
- onChange={e => this.setInternalSharing({ user, notificationDoc }, e.currentTarget.value, undefined)}
- >
- {this.sharingOptions}
- </select>
- </div>
+ There are no users this document has been shared with.
</div>
- );
- })
- }
+ :
+ userListContents
+ }
+ </div>
</div>
- </div>
- <div className={"group-container"}>
- <p className={"share-groups"}>Privately share {this.focusOn("this document")} with a group...</p>
- <div className={"groups-list"} style={{ display: existGroups ? "block" : "flex", minHeight: existOtherUsers ? undefined : 150 }}>{/*200*/}
- {!existGroups ? "There are no groups in your database." :
- this.groups.map(group => {
- const permissions = this.computePermissions(StrCast(group.groupName));
- const color = ColorMapping.get(permissions);
- return (
+ <div className={"group-container"}>
+ <div className={"groups-list"} style={{ display: displayGroupList ? "flex" : "block" }}>{/*200*/}
+ {
+ displayGroupList ?
<div
- key={StrCast(group.groupName)}
- className={"container"}
+ className={"none"}
>
- <span className={"padding"}>{group.groupName}</span>
- <div className="edit-actions">
- <select
- className={"permissions-dropdown"}
- value={permissions}
- style={{ color, borderColor: color }}
- onChange={e => this.setInternalGroupSharing(group, e.currentTarget.value)}
- >
- {this.sharingOptions}
- </select>
- <button onClick={action(() => this.groupToView = group)}>Edit</button>
+ There are no groups this document has been shared with.
</div>
- </div>
- );
- })
-
- }
+ :
+ groupListContents
+ }
+ </div>
</div>
</div>
+
</div>
- <div className={"close-button"} onClick={this.close}>Done</div>
</div>
);
}
@@ -412,6 +559,7 @@ export default class SharingManager extends React.Component<{}> {
interactive={true}
dialogueBoxDisplayedOpacity={this.dialogueBoxOpacity}
overlayDisplayedOpacity={this.overlayOpacity}
+ closeOnExternalClick={this.close}
/>
);
}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-07 05:56:29 +0000