Merge branch 'outline:main' into main

.env.sample

@@ -99,7 +99,7 @@ OIDC_USERINFO_URI=
 OIDC_USERNAME_CLAIM=preferred_username
 
 # Display name for OIDC authentication
-OIDC_DISPLAY_NAME=OpenID
+OIDC_DISPLAY_NAME=OpenID Connect
 
 # Space separated auth scopes.
 OIDC_SCOPES=openid profile email

.eslintrc

@@ -3,6 +3,7 @@
   "parserOptions": {
     "sourceType": "module",
     "extraFileExtensions": [".json"],
+    "project": "./tsconfig.json",
     "ecmaFeatures": {
       "jsx": true
     }
@@ -36,6 +37,14 @@
       "component": true,
       "html": true
     }],
+    "@typescript-eslint/no-floating-promises": "error",
+    "@typescript-eslint/await-thenable": "error",
+    "@typescript-eslint/no-misused-promises": [
+      "error",
+      {
+        "checksVoidReturn": false
+      }
+    ],
     "@typescript-eslint/no-unused-vars": [
       "error",
       {

app.json

@@ -88,7 +88,7 @@
     },
     "OIDC_DISPLAY_NAME": {
       "description": "Display name for OIDC authentication",
-      "value": "OpenID",
+      "value": "OpenID Connect",
       "required": false
     },
     "OIDC_SCOPES": {

app/actions/definitions/collections.tsx

@@ -124,13 +124,13 @@ export const starCollection = createAction({
       stores.policies.abilities(activeCollectionId).star
     );
   },
-  perform: ({ activeCollectionId, stores }) => {
+  perform: async ({ activeCollectionId, stores }) => {
     if (!activeCollectionId) {
       return;
     }
 
     const collection = stores.collections.get(activeCollectionId);
-    collection?.star();
+    await collection?.star();
   },
 });
 
@@ -150,13 +150,13 @@ export const unstarCollection = createAction({
       stores.policies.abilities(activeCollectionId).unstar
     );
   },
-  perform: ({ activeCollectionId, stores }) => {
+  perform: async ({ activeCollectionId, stores }) => {
     if (!activeCollectionId) {
       return;
     }
 
     const collection = stores.collections.get(activeCollectionId);
-    collection?.unstar();
+    await collection?.unstar();
   },
 });
 

app/actions/definitions/developer.tsx

@@ -5,6 +5,7 @@ import { createAction } from "~/actions";
 import { DeveloperSection } from "~/actions/sections";
 import env from "~/env";
 import { client } from "~/utils/ApiClient";
+import Logger from "~/utils/Logger";
 import { deleteAllDatabases } from "~/utils/developer";
 
 export const clearIndexedDB = createAction({
@@ -35,16 +36,27 @@ export const createTestUsers = createAction({
   },
 });
 
+export const toggleDebugLogging = createAction({
+  name: ({ t }) => t("Toggle debug logging"),
+  icon: <ToolsIcon />,
+  section: DeveloperSection,
+  perform: async ({ t }) => {
+    Logger.debugLoggingEnabled = !Logger.debugLoggingEnabled;
+    stores.toasts.showToast(
+      Logger.debugLoggingEnabled
+        ? t("Debug logging enabled")
+        : t("Debug logging disabled")
+    );
+  },
+});
+
 export const developer = createAction({
-  name: ({ t }) => t("Developer"),
+  name: ({ t }) => t("Development"),
   keywords: "debug",
   icon: <ToolsIcon />,
   iconInContextMenu: false,
   section: DeveloperSection,
-  visible: ({ event }) =>
-    env.ENVIRONMENT === "development" ||
-    (event instanceof KeyboardEvent && event.altKey),
-  children: [clearIndexedDB, createTestUsers],
+  children: [clearIndexedDB, toggleDebugLogging, createTestUsers],
 });
 
 export const rootDeveloperActions = [developer];

app/actions/definitions/documents.tsx

@@ -98,13 +98,13 @@ export const starDocument = createAction({
       !document?.isStarred && stores.policies.abilities(activeDocumentId).star
     );
   },
-  perform: ({ activeDocumentId, stores }) => {
+  perform: async ({ activeDocumentId, stores }) => {
     if (!activeDocumentId) {
       return;
     }
 
     const document = stores.documents.get(activeDocumentId);
-    document?.star();
+    await document?.star();
   },
 });
 
@@ -124,13 +124,13 @@ export const unstarDocument = createAction({
       stores.policies.abilities(activeDocumentId).unstar
     );
   },
-  perform: ({ activeDocumentId, stores }) => {
+  perform: async ({ activeDocumentId, stores }) => {
     if (!activeDocumentId) {
       return;
     }
 
     const document = stores.documents.get(activeDocumentId);
-    document?.unstar();
+    await document?.unstar();
   },
 });
 
@@ -186,14 +186,14 @@ export const unpublishDocument = createAction({
     }
     return stores.policies.abilities(activeDocumentId).unpublish;
   },
-  perform: ({ activeDocumentId, stores, t }) => {
+  perform: async ({ activeDocumentId, stores, t }) => {
     if (!activeDocumentId) {
       return;
     }
 
     const document = stores.documents.get(activeDocumentId);
 
-    document?.unpublish();
+    await document?.unpublish();
 
     stores.toasts.showToast(t("Document unpublished"), {
       type: "success",
@@ -218,14 +218,14 @@ export const subscribeDocument = createAction({
       stores.policies.abilities(activeDocumentId).subscribe
     );
   },
-  perform: ({ activeDocumentId, stores, t }) => {
+  perform: async ({ activeDocumentId, stores, t }) => {
     if (!activeDocumentId) {
       return;
     }
 
     const document = stores.documents.get(activeDocumentId);
 
-    document?.subscribe();
+    await document?.subscribe();
 
     stores.toasts.showToast(t("Subscribed to document notifications"), {
       type: "success",
@@ -250,14 +250,14 @@ export const unsubscribeDocument = createAction({
       stores.policies.abilities(activeDocumentId).unsubscribe
     );
   },
-  perform: ({ activeDocumentId, stores, currentUserId, t }) => {
+  perform: async ({ activeDocumentId, stores, currentUserId, t }) => {
     if (!activeDocumentId || !currentUserId) {
       return;
     }
 
     const document = stores.documents.get(activeDocumentId);
 
-    document?.unsubscribe(currentUserId);
+    await document?.unsubscribe(currentUserId);
 
     stores.toasts.showToast(t("Unsubscribed from document notifications"), {
       type: "success",
@@ -274,13 +274,13 @@ export const downloadDocumentAsHTML = createAction({
   iconInContextMenu: false,
   visible: ({ activeDocumentId, stores }) =>
     !!activeDocumentId && stores.policies.abilities(activeDocumentId).download,
-  perform: ({ activeDocumentId, stores }) => {
+  perform: async ({ activeDocumentId, stores }) => {
     if (!activeDocumentId) {
       return;
     }
 
     const document = stores.documents.get(activeDocumentId);
-    document?.download(ExportContentType.Html);
+    await document?.download(ExportContentType.Html);
   },
 });
 
@@ -321,13 +321,13 @@ export const downloadDocumentAsMarkdown = createAction({
   iconInContextMenu: false,
   visible: ({ activeDocumentId, stores }) =>
     !!activeDocumentId && stores.policies.abilities(activeDocumentId).download,
-  perform: ({ activeDocumentId, stores }) => {
+  perform: async ({ activeDocumentId, stores }) => {
     if (!activeDocumentId) {
       return;
     }
 
     const document = stores.documents.get(activeDocumentId);
-    document?.download(ExportContentType.Markdown);
+    await document?.download(ExportContentType.Markdown);
   },
 });
 

app/actions/definitions/navigation.tsx

@@ -142,6 +142,14 @@ export const openAPIDocumentation = createAction({
   perform: () => window.open(developersUrl()),
 });
 
+export const toggleSidebar = createAction({
+  name: ({ t }) => t("Toggle sidebar"),
+  analyticsName: "Toggle sidebar",
+  keywords: "hide show navigation",
+  section: NavigationSection,
+  perform: ({ stores }) => stores.ui.toggleCollapsedSidebar(),
+});
+
 export const openFeedbackUrl = createAction({
   name: ({ t }) => t("Send us feedback"),
   analyticsName: "Open feedback",
@@ -217,5 +225,6 @@ export const rootNavigationActions = [
   openBugReportUrl,
   openChangelog,
   openKeyboardShortcuts,
+  toggleSidebar,
   logout,
 ];

app/components/Authenticated.tsx

@@ -18,7 +18,7 @@ const Authenticated = ({ children }: Props) => {
   // Watching for language changes here as this is the earliest point we have
   // the user available and means we can start loading translations faster
   React.useEffect(() => {
-    changeLanguage(language, i18n);
+    void changeLanguage(language, i18n);
   }, [i18n, language]);
 
   if (auth.authenticated) {
@@ -31,7 +31,7 @@ const Authenticated = ({ children }: Props) => {
     return children;
   }
 
-  auth.logout(true);
+  void auth.logout(true);
   return <Redirect to="/" />;
 };
 

app/components/AuthenticatedLayout.tsx

@@ -97,7 +97,10 @@ const AuthenticatedLayout: React.FC = ({ children }) => {
     team?.getPreference(TeamPreference.Commenting);
 
   const sidebarRight = (
-    <AnimatePresence>
+    <AnimatePresence
+      initial={false}
+      key={ui.activeDocumentId ? "active" : "inactive"}
+    >
       {(showHistory || showInsights || showComments) && (
         <Route path={`/doc/${slug}`}>
           <SidebarRight>

app/components/Avatar/Avatar.tsx

@@ -8,6 +8,7 @@ export enum AvatarSize {
   Medium = 24,
   Large = 32,
   XLarge = 48,
+  XXLarge = 64,
 }
 
 export interface IAvatar {

app/components/Collaborators.tsx

@@ -57,7 +57,7 @@ function Collaborators(props: Props) {
 
     if (!isEqual(requestedUserIds, ids) && ids.length > 0) {
       setRequestedUserIds(ids);
-      users.fetchPage({ ids, limit: 100 });
+      void users.fetchPage({ ids, limit: 100 });
     }
   }, [document, users, presentIds, document.collaboratorIds, requestedUserIds]);
 

app/components/CollectionDescription.tsx

@@ -71,9 +71,9 @@ function CollectionDescription({ collection }: Props) {
   );
 
   const handleChange = React.useCallback(
-    (getValue) => {
+    async (getValue) => {
       setDirty(true);
-      handleSave(getValue);
+      await handleSave(getValue);
     },
     [handleSave]
   );

app/components/ContextMenu/MenuItem.tsx

@@ -38,13 +38,13 @@ const MenuItem = (
   ref: React.Ref<HTMLAnchorElement>
 ) => {
   const handleClick = React.useCallback(
-    (ev) => {
+    async (ev) => {
+      hide?.();
+
       if (onClick) {
         ev.preventDefault();
-        onClick(ev);
+        await onClick(ev);
       }
-
-      hide?.();
     },
     [onClick, hide]
   );

app/components/DefaultCollectionInputSelect.tsx

@@ -28,7 +28,7 @@ const DefaultCollectionInputSelect = ({
   const { showToast } = useToasts();
 
   React.useEffect(() => {
-    async function load() {
+    async function fetchData() {
       if (!collections.isLoaded && !fetching && !fetchError) {
         try {
           setFetching(true);
@@ -48,7 +48,7 @@ const DefaultCollectionInputSelect = ({
         }
       }
     }
-    load();
+    void fetchData();
   }, [showToast, fetchError, t, fetching, collections]);
 
   const options = React.useMemo(

app/components/DesktopEventHandler.tsx

@@ -30,7 +30,7 @@ export default function DesktopEventHandler() {
         action: {
           text: "Install now",
           onClick: () => {
-            Desktop.bridge?.restartAndInstall();
+            void Desktop.bridge?.restartAndInstall();
           },
         },
       });

app/components/DocumentCard.tsx

@@ -58,10 +58,10 @@ function DocumentCard(props: Props) {
   };
 
   const handleUnpin = React.useCallback(
-    (ev) => {
+    async (ev) => {
       ev.preventDefault();
       ev.stopPropagation();
-      pin?.delete();
+      await pin?.delete();
     },
     [pin]
   );

app/components/DocumentExplorer.tsx

@@ -164,7 +164,7 @@ function DocumentExplorer({ onSubmit, onSelect, items }: Props) {
         (collection) => expandedNodes.includes(collection.id) || searchTerm
       )
       .forEach((collection) => {
-        collection.fetchDocuments();
+        void collection.fetchDocuments();
       });
   }, [collections, expandedNodes, searchTerm]);
 

app/components/DocumentListItem.tsx

@@ -261,7 +261,6 @@ const Heading = styled.h3<{ rtl?: boolean }>`
   height: 24px;
   margin-top: 0;
   margin-bottom: 0.25em;
-  overflow: hidden;
   white-space: nowrap;
   color: ${s("text")};
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,

app/components/EventListItem.tsx

@@ -51,9 +51,9 @@ const EventListItem = ({ event, latest, document, ...rest }: Props) => {
     ref.current?.focus();
   };
 
-  const prefetchRevision = () => {
+  const prefetchRevision = async () => {
     if (event.name === "revisions.create" && event.modelId) {
-      revisions.fetch(event.modelId);
+      await revisions.fetch(event.modelId);
     }
   };