Assorted cleanup, minor bug fixes, styling fixes, eslint rules (#5165

* fix: Logic error in toast
fix: Remove useless component

* fix: Logout not clearing all stores

* Add icons to notification settings

* Add eslint rule to enforce spaced comment

* Add eslint rule for arrow-body-style

* Add eslint rule to enforce self-closing components

* Add menu to api key settings
Fix: Deleting webhook subscription does not remove from UI
Split webhook subscriptions into active and inactive
Styling updates

app/stores/AuthStore.ts

@@ -223,9 +223,7 @@ export default class AuthStore {
   };
 
   @action
-  requestDelete = () => {
-    return client.post(`/users.requestDelete`);
-  };
+  requestDelete = () => client.post(`/users.requestDelete`);
 
   @action
   deleteUser = async (data: { code: string }) => {
@@ -350,5 +348,6 @@ export default class AuthStore {
 
     // Tell the host application we logged out, if any – allows window cleanup.
     Desktop.bridge?.onLogout?.();
+    this.rootStore.logout();
   };
 }

app/stores/CollectionsStore.ts

@@ -218,9 +218,8 @@ export default class CollectionsStore extends BaseStore<Collection> {
     this.rootStore.documents.fetchRecentlyViewed();
   };
 
-  export = (format: FileOperationFormat) => {
-    return client.post("/collections.export_all", {
+  export = (format: FileOperationFormat) =>
+    client.post("/collections.export_all", {
       format,
     });
-  };
 }

app/stores/DocumentsStore.ts

@@ -303,81 +303,66 @@ export default class DocumentsStore extends BaseStore<Document> {
   };
 
   @action
-  fetchArchived = async (options?: PaginationParams): Promise<Document[]> => {
-    return this.fetchNamedPage("archived", options);
-  };
+  fetchArchived = async (options?: PaginationParams): Promise<Document[]> =>
+    this.fetchNamedPage("archived", options);
 
   @action
-  fetchDeleted = async (options?: PaginationParams): Promise<Document[]> => {
-    return this.fetchNamedPage("deleted", options);
-  };
+  fetchDeleted = async (options?: PaginationParams): Promise<Document[]> =>
+    this.fetchNamedPage("deleted", options);
 
   @action
   fetchRecentlyUpdated = async (
     options?: PaginationParams
-  ): Promise<Document[]> => {
-    return this.fetchNamedPage("list", options);
-  };
+  ): Promise<Document[]> => this.fetchNamedPage("list", options);
 
   @action
-  fetchTemplates = async (options?: PaginationParams): Promise<Document[]> => {
-    return this.fetchNamedPage("list", { ...options, template: true });
-  };
+  fetchTemplates = async (options?: PaginationParams): Promise<Document[]> =>
+    this.fetchNamedPage("list", { ...options, template: true });
 
   @action
-  fetchAlphabetical = async (
-    options?: PaginationParams
-  ): Promise<Document[]> => {
-    return this.fetchNamedPage("list", {
+  fetchAlphabetical = async (options?: PaginationParams): Promise<Document[]> =>
+    this.fetchNamedPage("list", {
       sort: "title",
       direction: "ASC",
       ...options,
     });
-  };
 
   @action
   fetchLeastRecentlyUpdated = async (
     options?: PaginationParams
-  ): Promise<Document[]> => {
-    return this.fetchNamedPage("list", {
+  ): Promise<Document[]> =>
+    this.fetchNamedPage("list", {
       sort: "updatedAt",
       direction: "ASC",
       ...options,
     });
-  };
 
   @action
   fetchRecentlyPublished = async (
     options?: PaginationParams
-  ): Promise<Document[]> => {
-    return this.fetchNamedPage("list", {
+  ): Promise<Document[]> =>
+    this.fetchNamedPage("list", {
       sort: "publishedAt",
       direction: "DESC",
       ...options,
     });
-  };
 
   @action
   fetchRecentlyViewed = async (
     options?: PaginationParams
-  ): Promise<Document[]> => {
-    return this.fetchNamedPage("viewed", options);
-  };
+  ): Promise<Document[]> => this.fetchNamedPage("viewed", options);
 
   @action
-  fetchStarred = (options?: PaginationParams): Promise<Document[]> => {
-    return this.fetchNamedPage("starred", options);
-  };
+  fetchStarred = (options?: PaginationParams): Promise<Document[]> =>
+    this.fetchNamedPage("starred", options);
 
   @action
-  fetchDrafts = (options?: PaginationParams): Promise<Document[]> => {
-    return this.fetchNamedPage("drafts", options);
-  };
+  fetchDrafts = (options?: PaginationParams): Promise<Document[]> =>
+    this.fetchNamedPage("drafts", options);
 
   @action
-  fetchOwned = (options?: PaginationParams): Promise<Document[]> => {
-    return this.fetchNamedPage("list", options);
-  };
+  fetchOwned = (options?: PaginationParams): Promise<Document[]> =>
+    this.fetchNamedPage("list", options);
 
   @action
   searchTitles = async (query: string, options?: SearchParams) => {
@@ -778,11 +763,10 @@ export default class DocumentsStore extends BaseStore<Document> {
     });
   };
 
-  star = (document: Document) => {
-    return this.rootStore.stars.create({
+  star = (document: Document) =>
+    this.rootStore.stars.create({
       documentId: document.id,
     });
-  };
 
   unstar = (document: Document) => {
     const star = this.rootStore.stars.orderedData.find(
@@ -791,12 +775,11 @@ export default class DocumentsStore extends BaseStore<Document> {
     return star?.delete();
   };
 
-  subscribe = (document: Document) => {
-    return this.rootStore.subscriptions.create({
+  subscribe = (document: Document) =>
+    this.rootStore.subscriptions.create({
       documentId: document.id,
       event: "documents.update",
     });
-  };
 
   unsubscribe = (userId: string, document: Document) => {
     const subscription = this.rootStore.subscriptions.orderedData.find(
@@ -808,9 +791,8 @@ export default class DocumentsStore extends BaseStore<Document> {
     return subscription?.delete();
   };
 
-  getByUrl = (url = ""): Document | undefined => {
-    return find(this.orderedData, (doc) => url.endsWith(doc.urlId));
-  };
+  getByUrl = (url = ""): Document | undefined =>
+    find(this.orderedData, (doc) => url.endsWith(doc.urlId));
 
   getCollectionForDocument(document: Document) {
     return this.rootStore.collections.data.get(document.collectionId);

app/stores/GroupMembershipsStore.ts

@@ -73,7 +73,6 @@ export default class GroupMembershipsStore extends BaseStore<GroupMembership> {
     });
   };
 
-  inGroup = (groupId: string) => {
-    return filter(this.orderedData, (member) => member.groupId === groupId);
-  };
+  inGroup = (groupId: string) =>
+    filter(this.orderedData, (member) => member.groupId === groupId);
 }

app/stores/PinsStore.ts

@@ -35,11 +35,10 @@ export default class PinsStore extends BaseStore<Pin> {
     }
   };
 
-  inCollection = (collectionId: string) => {
-    return computed(() => this.orderedData)
+  inCollection = (collectionId: string) =>
+    computed(() => this.orderedData)
       .get()
       .filter((pin) => pin.collectionId === collectionId);
-  };
 
   @computed
   get home() {

app/stores/RootStore.ts

@@ -87,30 +87,10 @@ export default class RootStore {
   }
 
   logout() {
-    this.apiKeys.clear();
-    this.authenticationProviders.clear();
-    // this.auth omitted for reasons...
-    this.collections.clear();
-    this.collectionGroupMemberships.clear();
-    this.comments.clear();
-    this.documents.clear();
-    this.events.clear();
-    this.groups.clear();
-    this.groupMemberships.clear();
-    this.integrations.clear();
-    this.memberships.clear();
-    this.presence.clear();
-    this.pins.clear();
-    this.policies.clear();
-    this.revisions.clear();
-    this.searches.clear();
-    this.shares.clear();
-    this.stars.clear();
-    this.subscriptions.clear();
-    this.fileOperations.clear();
-    // this.ui omitted to keep ui settings between sessions
-    this.users.clear();
-    this.views.clear();
-    this.webhookSubscriptions.clear();
+    Object.getOwnPropertyNames(this)
+      .filter((key) => ["auth", "ui"].includes(key) === false)
+      .forEach((key) => {
+        this[key]?.clear?.();
+      });
   }
 }

app/stores/SharesStore.ts

@@ -99,7 +99,6 @@ export default class SharesStore extends BaseStore<Share> {
     return undefined;
   };
 
-  getByDocumentId = (documentId: string): Share | null | undefined => {
-    return find(this.orderedData, (share) => share.documentId === documentId);
-  };
+  getByDocumentId = (documentId: string): Share | null | undefined =>
+    find(this.orderedData, (share) => share.documentId === documentId);
 }

app/stores/UsersStore.ts

@@ -143,11 +143,10 @@ export default class UsersStore extends BaseStore<User> {
   };
 
   @action
-  resendInvite = async (user: User) => {
-    return client.post(`/users.resendInvite`, {
+  resendInvite = async (user: User) =>
+    client.post(`/users.resendInvite`, {
       id: user.id,
     });
-  };
 
   @action
   fetchCounts = async (teamId: string): Promise<any> => {

app/stores/WebhookSubscriptionStore.ts

@@ -1,3 +1,4 @@
+import { computed } from "mobx";
 import WebhookSubscription from "~/models/WebhookSubscription";
 import BaseStore, { RPCAction } from "./BaseStore";
 import RootStore from "./RootStore";
@@ -15,4 +16,14 @@ export default class WebhookSubscriptionsStore extends BaseStore<
   constructor(rootStore: RootStore) {
     super(rootStore, WebhookSubscription);
   }
+
+  @computed
+  get enabled() {
+    return this.orderedData.filter((subscription) => subscription.enabled);
+  }
+
+  @computed
+  get disabled() {
+    return this.orderedData.filter((subscription) => !subscription.enabled);
+  }
 }