Reorder menu, improve libraries page placeholder

packages/repl/src/components/nav/NavbarMenu.tsx

@@ -92,10 +92,6 @@ export function NavbarMenu(props: {
           </DropdownMenuGroup>
           <DropdownMenuSeparator />
           <DropdownMenuGroup>
-            <DropdownMenuItem onClick={props.onShowAccounts}>
-              <LucideUsers class="mr-2 size-4" />
-              Manage accounts
-            </DropdownMenuItem>
             <DropdownMenuSub>
               <DropdownMenuSubTrigger class="flex items-center justify-between">
                 <div class="flex flex-row items-center">
@@ -141,6 +137,10 @@ export function NavbarMenu(props: {
                 </DropdownMenuItem>
               </DropdownMenuSubContent>
             </DropdownMenuSub>
+            <DropdownMenuItem onClick={props.onShowAccounts}>
+              <LucideUsers class="mr-2 size-4" />
+              Manage accounts
+            </DropdownMenuItem>
             <DropdownMenuItem
               as="a"
               class="cursor-pointer"

packages/repl/src/components/settings/LibrariesTab.tsx

@@ -0,0 +1,16 @@
+export function LibrariesTab() {
+  return (
+    <div class="flex size-full flex-col items-center justify-center">
+      <div class="mt-[-6%] flex flex-col items-center justify-center">
+        <div class="mb-1 text-2xl font-medium text-primary">
+          Not ready yet...
+        </div>
+        <div class="text-center text-sm text-muted-foreground">
+          This page is still in development.
+          <br />
+          Come back later.
+        </div>
+      </div>
+    </div>
+  )
+}

packages/repl/src/components/settings/Settings.tsx

@@ -9,6 +9,7 @@ import {
 import { cn } from '../../lib/utils.ts'
 import { AboutTab } from './AboutTab.tsx'
 import { AccountsTab } from './AccountsTab.tsx'
+import { LibrariesTab } from './LibrariesTab.tsx'
 
 export type SettingsTab =
   | 'accounts'
@@ -32,7 +33,7 @@ const tabs: Array<TabDefinition> = [
     id: 'libraries',
     title: 'Libraries',
     icon: LucideLibrary,
-    content: () => <div class="p-3">Not implemented yet...</div>,
+    content: LibrariesTab,
   },
   {
     id: 'about',