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/routes/Onboarding/Introduction.tsx

@@ -1,10 +1,10 @@
 import { faArrowRight, faXmark } from '@fortawesome/free-solid-svg-icons'
 import { ActionButton } from '../../components/ActionButton'
-import { useDismiss, useNextClick } from '.'
+import { onboardingPaths, useDismiss, useNextClick } from '.'
 
-const Introduction = () => {
+export default function Introduction() {
   const dismiss = useDismiss()
-  const next = useNextClick('units')
+  const next = useNextClick(onboardingPaths.UNITS)
 
   return (
     <div className="fixed grid place-content-center inset-0 bg-chalkboard-110/50 z-50">
@@ -22,6 +22,7 @@ const Introduction = () => {
         </p>
         <div className="flex justify-between mt-6">
           <ActionButton
+            Element="button"
             onClick={dismiss}
             icon={{
               icon: faXmark,
@@ -33,7 +34,11 @@ const Introduction = () => {
           >
             Dismiss
           </ActionButton>
-          <ActionButton onClick={next} icon={{ icon: faArrowRight }}>
+          <ActionButton
+            Element="button"
+            onClick={next}
+            icon={{ icon: faArrowRight }}
+          >
             Get Started
           </ActionButton>
         </div>
@@ -41,5 +46,3 @@ const Introduction = () => {
     </div>
   )
 }
-
-export default Introduction