fix: make logo work as intended && organize components and pages

src/App.tsx

@@ -2,32 +2,33 @@ import { Icon } from 'solid-heroicons';
 import { lockClosed, magnifyingGlass } from 'solid-heroicons/outline';
 import { For, ParentComponent, Show } from 'solid-js';
 import vault from './assets/vault-logo.svg';
-import Breadcrumbs from './Breadcrumbs';
-import Node from './Node';
-import { state } from './state';
+import { setState, state } from './state';
 import { fetchKVS, toSorted } from './utils';
 import { createQuery } from '@tanstack/solid-query';
 import { A } from '@solidjs/router';
+import { Breadcrumbs, Node } from './components';
 
 const App: ParentComponent = (props) => {
     const kvsQuery = createQuery(() => ({
         queryKey: ['kvs'],
         queryFn: fetchKVS,
         enabled: state.authenticated,
     }));
+    console.log(state.authenticated);
 
     return (
         <>
             <header class="supports-backdrop-blur:bg-background/60 bg-background/95 sticky top-0 z-40 w-full border-b bg-black backdrop-blur">
                 <div class="container flex h-14 items-center">
                     <div class="ml-4 flex">
-                        <a
+                        <A
                             href="/"
+                            onClick={() => setState({ kv: '', path: '' })}
                             class="mr-6 flex items-center space-x-2 no-underline"
                         >
                             <img src={vault} class="h-5 w-5" />
                             <span class="inline-block font-bold text-white">Vault</span>
-                        </a>
+                        </A>
                         <nav class="flex items-center space-x-6 text-sm font-medium">
                             <Show when={state.authenticated}>
                                 <A

src/Breadcrumbs.tsx → src/components/breadcrumbs.tsx

@@ -1,6 +1,6 @@
 import { For, Show, createSignal } from 'solid-js';
-import { setState, state } from './state';
-import { splitPath } from './utils';
+import { setState, state } from '@/state';
+import { splitPath } from '@/utils';
 import { createQuery, useQueryClient } from '@tanstack/solid-query';
 import { Icon } from 'solid-heroicons';
 import { arrowPath } from 'solid-heroicons/outline';

src/components/index.ts

@@ -0,0 +1,4 @@
+export { default as Breadcrumbs } from './breadcrumbs';
+export { default as Item } from './item';
+export { default as Node } from './node';
+export { default as SearchResult } from './search-result';

src/Item.tsx → src/components/item.tsx

@@ -1,7 +1,7 @@
 import { Icon } from 'solid-heroicons';
 import { JSXElement, Show, type Component } from 'solid-js';
-import { setState, state } from './state';
-import { splitPath } from './utils';
+import { setState, state } from '@/state';
+import { splitPath } from '@/utils';
 import { A } from '@solidjs/router';
 
 type ItemProps = {

src/Node.tsx → src/components/node.tsx

@@ -6,9 +6,9 @@ import {
     folder,
 } from 'solid-heroicons/outline';
 import { createSignal, For, JSXElement, Show, type Component } from 'solid-js';
-import Item from './Item';
 import { createQuery } from '@tanstack/solid-query';
-import { fetchPaths, toSorted } from './utils';
+import { fetchPaths, toSorted } from '@/utils';
+import { Item } from '@/components';
 
 type NodeProps = {
     icon: { path: JSXElement; outline: boolean; mini: boolean };

src/index.tsx

@@ -4,16 +4,11 @@ import App from './App';
 import './index.css';
 
 import { Navigate, Route, Router } from '@solidjs/router';
-import Login from './Login';
 import { state } from './state';
-import SecretView from './SecretView';
-import SecretList from './SecretList';
-import SearchIndex from './SearchIndex';
-import Home from './Home';
-import Search from './Search';
 import { QueryCache, QueryClient, QueryClientProvider } from '@tanstack/solid-query';
 import { SolidQueryDevtools } from '@tanstack/solid-query-devtools';
 import toast, { Toaster } from 'solid-toast';
+import { Home, Login, Search, SearchIndex, SecretList, SecretView } from './pages';
 
 const queryClient = new QueryClient({
     defaultOptions: {

src/pages/index.ts

@@ -0,0 +1,6 @@
+export { default as Home } from './home';
+export { default as Login } from './login';
+export { default as SearchIndex } from './search-index';
+export { default as Search } from './search';
+export { default as SecretList } from './secret-list';
+export { default as SecretView } from './secret-view';

src/Login.tsx → src/pages/login.tsx

@@ -1,7 +1,7 @@
 import { invoke } from '@tauri-apps/api/tauri';
 import { onMount, type Component } from 'solid-js';
 import toast from 'solid-toast';
-import { setState } from './state';
+import { setState } from '@/state';
 import { useNavigate } from '@solidjs/router';
 
 const Login: Component = () => {

src/SearchIndex.tsx → src/pages/search-index.tsx

@@ -1,5 +1,5 @@
 import { createSignal, type Component } from 'solid-js';
-import { fetchKVS, fetchPaths } from './utils';
+import { fetchKVS, fetchPaths } from '@/utils';
 
 const SearchIndex: Component = () => {
     const [progress, setProgress] = createSignal(0);

src/Search.tsx → src/pages/search.tsx

@@ -1,5 +1,5 @@
 import { createSignal, For, Show, type Component } from 'solid-js';
-import SearchResult from './SearchResult';
+import { SearchResult } from '@/components';
 import toast from 'solid-toast';
 import { A } from '@solidjs/router';
 

src/SecretList.tsx → src/pages/secret-list.tsx

@@ -1,10 +1,9 @@
 import { document as documentIcon, folder } from 'solid-heroicons/outline';
 import { createEffect, createSignal, For, Show, type Component } from 'solid-js';
-import Item from './Item';
-import { fetchPaths } from './utils';
-import { state } from './state';
+import { fetchPaths, toSorted } from '@/utils';
+import { state } from '@/state';
 import { createQuery } from '@tanstack/solid-query';
-import { toSorted } from './utils';
+import { Item } from '@/components';
 
 const ListView: Component = () => {
     console.log(state.path);

src/SecretView.tsx → src/pages/secret-view.tsx

@@ -1,8 +1,8 @@
 import { writeText } from '@tauri-apps/api/clipboard';
 import { For, Show, type Component } from 'solid-js';
 import toast from 'solid-toast';
-import { fetchSecret } from './utils';
-import { state } from './state';
+import { fetchSecret } from '@/utils';
+import { state } from '@/state';
 import { createQuery } from '@tanstack/solid-query';
 
 const SecretView: Component = () => {
@@ -34,7 +34,7 @@ const SecretView: Component = () => {
                     </Show>
                     <Show when={query.isSuccess}>
                         <For each={Object.entries(query.data)}>
-                            {([key, value]) => (
+                            {([key, value]: [string, string]) => (
                                 <tr class="border-b bg-white dark:border-gray-700 dark:bg-gray-800">
                                     <th
                                         scope="row"