Home page in desktop, separate file support (#252)

* Bugfix: don't toast on every change of defaultDir

* Refactor app to live under /file/:id

* Stub out Tauri-only home page

* home reads and writes blank files to defaultDir

* Fix initial directory creation

* Make file names editable

* Refactor onboarding to use normal fns for load issues

* Feature: load and write files to and from disk

* Feature: Add file deletion, break out FileCard component

* Fix settings close URLs to be relative, button types

* Add filename and link to AppHeader

* Style tweaks: scrollbar, header name, card size

* Style: add header, empty state to Home

* Refactor: load file in route loader

* Move makePathRelative to lib to fix tests

* Fix App test

* Use '$nnn' default name scheme

* Fix type error on ActionButton

* Fix type error on ActionButton

* @adamchalmers review

* Fix merge mistake

* Refactor: rename all things "file" to "project"

* Feature: migrate to <project-name>/main.kcl setup

* Fix tsc test

* @Irev-Dev review part 1: renames and imports

* @Irev-Dev review pt 2: simplify file list refresh

* @Irev-Dev review pt 3: filter out non-projects

* @Irev-review pt 4: folder conventions + home auth

* Add sort functionality to new welcome page (#255)

* Add todo for Sentry

src/Router.tsx

@@ -13,6 +13,16 @@ import Onboarding, {
 } from './routes/Onboarding'
 import SignIn from './routes/SignIn'
 import { Auth } from './Auth'
+import { isTauri } from './lib/isTauri'
+import Home from './routes/Home'
+import { FileEntry, readDir, readTextFile } from '@tauri-apps/api/fs'
+import makeUrlPathRelative from './lib/makeUrlPathRelative'
+import {
+  initializeProjectDirectory,
+  isProjectDirectory,
+  PROJECT_ENTRYPOINT,
+} from './lib/tauriFS'
+import { metadata, type Metadata } from 'tauri-plugin-fs-extra-api'
 
 const prependRoutes =
   (routesObject: Record<string, string>) => (prepend: string) => {
@@ -26,16 +36,34 @@ const prependRoutes =
 
 export const paths = {
   INDEX: '/',
+  HOME: '/home',
+  FILE: '/file',
   SETTINGS: '/settings',
   SIGN_IN: '/signin',
   ONBOARDING: prependRoutes(onboardingPaths)(
-    '/onboarding/'
+    '/onboarding'
   ) as typeof onboardingPaths,
 }
 
+export type IndexLoaderData = {
+  code: string | null
+}
+
+export type ProjectWithEntryPointMetadata = FileEntry & {
+  entrypoint_metadata: Metadata
+}
+export type HomeLoaderData = {
+  projects: ProjectWithEntryPointMetadata[]
+}
+
 const router = createBrowserRouter([
   {
     path: paths.INDEX,
+    loader: () =>
+      isTauri() ? redirect(paths.HOME) : redirect(paths.FILE + '/new'),
+  },
+  {
+    path: paths.FILE + '/:id',
     element: (
       <Auth>
         <Outlet />
@@ -43,7 +71,10 @@ const router = createBrowserRouter([
       </Auth>
     ),
     errorElement: <ErrorPage />,
-    loader: ({ request }) => {
+    loader: async ({
+      request,
+      params,
+    }): Promise<IndexLoaderData | Response> => {
       const store = localStorage.getItem('store')
       if (store === null) {
         return redirect(paths.ONBOARDING.INDEX)
@@ -60,23 +91,72 @@ const router = createBrowserRouter([
           notEnRouteToOnboarding && hasValidOnboardingStatus
 
         if (shouldRedirectToOnboarding) {
-          return redirect(paths.ONBOARDING.INDEX + status)
+          return redirect(makeUrlPathRelative(paths.ONBOARDING.INDEX) + status)
         }
       }
-      return null
+
+      if (params.id && params.id !== 'new') {
+        // Note that PROJECT_ENTRYPOINT is hardcoded until we support multiple files
+        const code = await readTextFile(params.id + '/' + PROJECT_ENTRYPOINT)
+
+        return {
+          code,
+        }
+      }
+
+      return {
+        code: '',
+      }
     },
     children: [
       {
-        path: paths.SETTINGS,
+        path: makeUrlPathRelative(paths.SETTINGS),
         element: <Settings />,
       },
       {
-        path: paths.ONBOARDING.INDEX,
+        path: makeUrlPathRelative(paths.ONBOARDING.INDEX),
         element: <Onboarding />,
         children: onboardingRoutes,
       },
     ],
   },
+  {
+    path: paths.HOME,
+    element: (
+      <Auth>
+        <Outlet />
+        <Home />
+      </Auth>
+    ),
+    loader: async () => {
+      if (!isTauri()) {
+        return redirect(paths.FILE + '/new')
+      }
+
+      const projectDir = await initializeProjectDirectory()
+      const projectsNoMeta = (await readDir(projectDir.dir)).filter(
+        isProjectDirectory
+      )
+      const projects = await Promise.all(
+        projectsNoMeta.map(async (p) => ({
+          entrypoint_metadata: await metadata(
+            p.path + '/' + PROJECT_ENTRYPOINT
+          ),
+          ...p,
+        }))
+      )
+
+      return {
+        projects,
+      }
+    },
+    children: [
+      {
+        path: makeUrlPathRelative(paths.SETTINGS),
+        element: <Settings />,
+      },
+    ],
+  },
   {
     path: paths.SIGN_IN,
     element: <SignIn />,