fix: modified universal link

Author: qinluhe

frontend/appflowy_web_app/public/.well-known/apple-app-site-association

@@ -1,25 +1 @@
-{
-  "applinks": {
-    "apps": [],
-    "details": [
-      {
-        "appIDs": [
-          "VHB67HRSZG.com.appflowy.appflowy.flutter"
-        ],
-        "paths": [
-          "*"
-        ],
-        "components": [
-          {
-            "/": "/*"
-          }
-        ]
-      }
-    ]
-  },
-  "webcredentials": {
-    "apps": [
-      "VHB67HRSZG.com.appflowy.appflowy.flutter"
-    ]
-  }
-}
+{"applinks":{"apps":[],"details":[{"appIDs":["VHB67HRSZG.com.appflowy.appflowy.flutter"],"paths":["/download","/download/*"],"components":[{"/":"/download","comment":"Matches any URL whose path starts with /download"},{"/":"/download/*","comment":"Matches any URL whose path starts with /download/"}]}]},"webcredentials":{"apps":["VHB67HRSZG.com.appflowy.appflowy.flutter"]}}

frontend/appflowy_web_app/public/.well-known/assetlinks.json

@@ -8,7 +8,8 @@
       "package_name": "io.appflowy.appflowy",
       "sha256_cert_fingerprints": [
         "19:13:85:33:DB:B3:A2:FD:65:2F:61:D7:F2:35:95:79:FE:6E:CC:B5:AC:94:AA:02:9E:BE:E7:0E:02:6B:45:FF"
-      ]
+      ],
+      "path_prefix": "/download"
     }
   }
 ]

frontend/appflowy_web_app/src/components/login/Login.tsx

@@ -5,7 +5,7 @@ import React from 'react';
 import { ReactComponent as Logo } from '@/assets/logo.svg';
 import { useTranslation } from 'react-i18next';
 
-export function Login({ redirectTo }: { redirectTo: string }) {
+export function Login ({ redirectTo }: { redirectTo: string }) {
   const { t } = useTranslation();
 
   return (
@@ -27,11 +27,19 @@ export function Login({ redirectTo }: { redirectTo: string }) {
         }
       >
         <span>{t('web.signInAgreement')} </span>
-        <a href={'https://appflowy.io/terms'} target={'_blank'} className={'text-fill-default underline'}>
+        <a
+          href={'https://appflowy.io/terms'}
+          target={'_blank'}
+          className={'text-fill-default underline'}
+        >
           {t('web.termOfUse')}
         </a>{' '}
         {t('web.and')}{' '}
-        <a href={'https://appflowy.io/privacy'} target={'_blank'} className={'text-fill-default underline'}>
+        <a
+          href={'https://appflowy.io/privacy'}
+          target={'_blank'}
+          className={'text-fill-default underline'}
+        >
           {t('web.privacyPolicy')}
         </a>
         .

frontend/appflowy_web_app/src/components/main/App.tsx

@@ -20,35 +20,35 @@ const AppMain = withAppWrapper(() => {
     <Routes>
       <Route
         path={'/:namespace/:publishName'}
-        element={<PublishPage/>}
+        element={<PublishPage />}
       />
       <Route
         path={'/login'}
-        element={<Suspense><LoginPage/></Suspense>}
+        element={<Suspense><LoginPage /></Suspense>}
       />
       <Route
         path={AUTH_CALLBACK_PATH}
-        element={<LoginAuth/>}
+        element={<LoginAuth />}
       />
       <Route
         path="/404"
-        element={<NotFound/>}
+        element={<NotFound />}
       />
       <Route
         path="/after-payment"
-        element={<Suspense><AfterPaymentPage/></Suspense>}
+        element={<Suspense><AfterPaymentPage /></Suspense>}
       />
       <Route
         path="/as-template"
-        element={<Suspense><AsTemplatePage/></Suspense>}
+        element={<Suspense><AsTemplatePage /></Suspense>}
       />
       <Route
         path="/accept-invitation"
-        element={<Suspense><AcceptInvitationPage/></Suspense>}
+        element={<Suspense><AcceptInvitationPage /></Suspense>}
       />
       <Route
         path={'/import'}
-        element={<Suspense><ImportPage/></Suspense>}
+        element={<Suspense><ImportPage /></Suspense>}
       />
       <Route
         path="/"
@@ -61,28 +61,23 @@ const AppMain = withAppWrapper(() => {
         path="/app/*"
         element={
           <Suspense>
-            <AppRouter/>
+            <AppRouter />
           </Suspense>
         }
       />
       <Route
         path="*"
-        element={<NotFound/>}
+        element={<NotFound />}
       />
     </Routes>
   );
 });
 
-function App() {
-  const path = window.location.pathname;
-  
-  if (path.startsWith('/.well-known')) {
-    return null;
-  }
+function App () {
 
   return (
     <BrowserRouter>
-      <AppMain/>
+      <AppMain />
     </BrowserRouter>
   );
 }

frontend/appflowy_web_app/src/components/quick-note/AddNote.tsx

@@ -5,7 +5,7 @@ import { QuickNote } from '@/application/types';
 import { Button, CircularProgress } from '@mui/material';
 import { useTranslation } from 'react-i18next';
 
-function AddNote({
+function AddNote ({
   onEnterNote,
   onAdd,
 }: {
@@ -27,9 +27,10 @@ function AddNote({
       <Button
         size={'small'}
         color={'inherit'}
-        startIcon={loading ? <CircularProgress className={'w-4 h-4'}/> : <AddIcon className={'w-4 h-4'}/>}
+        startIcon={loading ? <CircularProgress size={16} /> : <AddIcon className={'w-4 h-4'} />}
         onClick={handleAdd}
-        className={'justify-start w-full'}>
+        className={'justify-start w-full'}
+      >
         {t('quickNote.addNote')}
       </Button>
     </>

frontend/appflowy_web_app/src/components/quick-note/QuickNote.tsx

@@ -1,3 +1,4 @@
+import CircularProgress from '@mui/material/CircularProgress';
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { IconButton, Tooltip, Zoom, Snackbar, Portal } from '@mui/material';
 import { ReactComponent as EditIcon } from '@/assets/edit.svg';
@@ -16,7 +17,7 @@ import { getPopoverPosition, setPopoverPosition } from '@/components/quick-note/
 import Note from '@/components/quick-note/Note';
 
 const PAPER_SIZE = [480, 396];
-const Transition = React.forwardRef(function Transition(
+const Transition = React.forwardRef(function Transition (
   props: TransitionProps & {
     children: React.ReactElement;
   },
@@ -33,7 +34,7 @@ enum QuickNoteRoute {
   LIST = 'list',
 }
 
-export function QuickNote() {
+export function QuickNote () {
   const { t } = useTranslation();
   const modifier = useMemo(() => createHotKeyLabel(HOT_KEY_NAME.QUICK_NOTE), []);
   const [open, setOpen] = React.useState(false);
@@ -197,6 +198,7 @@ export function QuickNote() {
   useEffect(() => {
     resetPosition();
   }, [resetPosition]);
+  const [loading, setLoading] = React.useState(false);
 
   const buttonRef = useRef<HTMLButtonElement>(null);
   const handleOpen = useCallback(async (forceCreate?: boolean) => {
@@ -217,7 +219,7 @@ export function QuickNote() {
       } : prev);
     }
 
-    await initNoteList();
+    void initNoteList();
 
     if (route === QuickNoteRoute.LIST || forceCreate) {
       await handleAdd();
@@ -232,14 +234,18 @@ export function QuickNote() {
         e.stopPropagation();
         e.preventDefault();
 
+        if (loading) return;
         void (async () => {
+          setLoading(true);
           try {
             await handleOpen(true);
             // eslint-disable-next-line
           } catch (e: any) {
             console.error(e);
             handleOpenToast(e.message);
           }
+
+          setLoading(false);
         })();
       } else if (createHotkey(HOT_KEY_NAME.ESCAPE)(e)) {
         handleClose();
@@ -251,7 +257,7 @@ export function QuickNote() {
     return () => {
       document.removeEventListener('keydown', handleKeyDown);
     };
-  }, [handleOpen, handleOpenToast]);
+  }, [handleOpen, handleOpenToast, loading]);
 
   const handleMouseDown = (event: React.MouseEvent) => {
     if (!position) return;
@@ -393,7 +399,8 @@ export function QuickNote() {
           expand={expand}
           onToggleExpand={handleToggleExpand}
           onClose={handleClose}
-          onBack={handleBackList}/>
+          onBack={handleBackList}
+        />
       );
     }
 
@@ -423,26 +430,40 @@ export function QuickNote() {
 
   return (
     <>
-      <Tooltip title={
-        <>
-          <div>{t('quickNote.label')}</div>
-          <div className={'text-xs text-text-caption'}>{modifier}</div>
-        </>
-      }>
+      <Tooltip
+        title={
+          <>
+            <div>{t('quickNote.label')}</div>
+            <div className={'text-xs text-text-caption'}>{modifier}</div>
+          </>
+        }
+      >
         <IconButton
           ref={buttonRef}
           size={'small'}
-          onClick={e => {
+          onClick={async (e) => {
             e.currentTarget.blur();
             if (open) {
               handleClose();
               return;
             }
 
-            void handleOpen();
+            try {
+              setLoading(true);
+              await handleOpen();
+              // eslint-disable-next-line
+            } catch (e: any) {
+              console.error(e);
+              handleOpenToast(e.message);
+            }
+
+            setLoading(false);
+
           }}
+          disabled={loading}
         >
-          <EditIcon/>
+          {loading ? <CircularProgress size={16} /> :
+            <EditIcon />}
         </IconButton>
       </Tooltip>
       <Popover
@@ -481,21 +502,24 @@ export function QuickNote() {
         onClose={handleClose}
         keepMounted={true}
       >
-        <ToastContext.Provider value={{
-          onOpen: handleOpenToast,
-          onClose: () => {
-            setToastMessage('');
-            setOpenToast(false);
-          },
-          open: openToast,
-        }}>
+        <ToastContext.Provider
+          value={{
+            onOpen: handleOpenToast,
+            onClose: () => {
+              setToastMessage('');
+              setOpenToast(false);
+            },
+            open: openToast,
+          }}
+        >
           <div
             onMouseDown={handleMouseDown}
             style={{
               cursor: isDragging ? 'grabbing' : 'grab',
             }}
 
-            className={'bg-note-header py-2 px-5 flex items-center justify-between gap-5 h-[44px] w-full'}>
+            className={'bg-note-header py-2 px-5 flex items-center justify-between gap-5 h-[44px] w-full'}
+          >
             <div className={'flex-1 overflow-hidden w-full'}>{renderHeader()}</div>
           </div>
           <div
@@ -506,10 +530,12 @@ export function QuickNote() {
                 <>
                   <Note
                     onAdd={handleAddedNote}
-                    onEnterNote={handleEnterNote} note={currentNote}
+                    onEnterNote={handleEnterNote}
+                    note={currentNote}
                     onUpdateData={(data) => {
                       handleUpdateNodeData(currentNote.id, data);
-                    }}/>
+                    }}
+                  />
                 </> : <NoteList
                   onAdd={handleAddedNote}
                   onScroll={handleScrollList}

frontend/appflowy_web_app/src/utils/open_schema.ts

@@ -1,4 +1,4 @@
-import { androidDownloadLink, desktopDownloadLink, iosDownloadLink, openAppFlowySchema } from '@/utils/url';
+import { androidDownloadLink, desktopDownloadLink, openAppFlowySchema } from '@/utils/url';
 
 type OS = 'ios' | 'android' | 'other';
 
@@ -101,20 +101,30 @@ export const openAppOrDownload = (config: AppConfig): void => {
   };
 };
 
-export function openOnly(schema?: string) {
+export function openOnly (schema?: string) {
 
   return openAppOrDownload({
     appScheme: schema || openAppFlowySchema,
   });
 }
 
-export function openOrDownload(schema?: string) {
+export function openOrDownload (schema?: string) {
   const os = getOS();
-  
-  const downloadUrl = os === 'ios' ? iosDownloadLink : os === 'android' ? androidDownloadLink : desktopDownloadLink;
+
+  if (os === 'ios' || os === 'android') {
+    const universalLink = 'https://appflowy.io/download';
+    const intentUrl = `intent://appflowy.io/download#Intent;` +
+      'scheme=https;' +
+      'package=io.appflowy.app;' +
+      `S.browser_fallback_url=${encodeURIComponent(androidDownloadLink)};` +
+      'end';
+
+    window.location.href = os === 'ios' ? universalLink : intentUrl;
+    return;
+  }
 
   return openAppOrDownload({
     appScheme: schema || openAppFlowySchema,
-    downloadUrl,
+    downloadUrl: desktopDownloadLink,
   });
 }