New Project Popup

src/newproject/main.tsx

@@ -0,0 +1,16 @@
+import ReactDOM from 'react-dom/client'
+import '@fontsource/ubuntu'
+import '../Globals.css'
+import Home from './routes/Home'
+
+export default function App () {
+  return (
+    <>
+      <Home />
+    </>
+  )
+}
+
+ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
+  <App />
+)

src/newproject/routes/Home.tsx

@@ -0,0 +1,3 @@
+export default function Home () {
+  return <></>
+}

src/projectmanager/componets/Sidebar.tsx

@@ -5,6 +5,7 @@ import { useEffect, useState } from 'react'
 
 export default function Sidebar () {
   const [version, setVersion] = useState<string | null>(null)
+  const [rotation, setRotation] = useState<number>(0)
 
   useEffect(() => {
     ;(async () => {
@@ -20,8 +21,17 @@ export default function Sidebar () {
           src={Icon}
           width={64}
           height={64}
-          className='m-2'
+          className='m-2 transition-transform duration-[1.5s]'
           draggable={false}
+          style={{
+            rotate: `${rotation}deg`
+          }}
+          onClick={() => {
+            setRotation(rotation + 1800)
+          }}
+          onContextMenu={() => {
+            setRotation(rotation - 1800)
+          }}
         ></img>
         <button onClick={() => (window.location.hash = 'projects')}>
           Projects

src/projectmanager/routes/Projects.tsx

@@ -1,10 +1,39 @@
+import { WebviewWindow } from '@tauri-apps/api/webviewWindow'
 import './Projects.css'
 
 export default function Projects () {
   return (
     <>
       <div className='topbar'>
-        <button>New Project</button>
+        <button
+          onClick={async () => {
+            const windowExists = await WebviewWindow.getByLabel(
+              'new_project_popup'
+            )
+            if (windowExists) return
+            const mainWindow = await WebviewWindow.getByLabel('main')
+            if (!mainWindow) return
+            const popup = new WebviewWindow('new_project_popup', {
+              title: 'Code Fly: New Project',
+              url: '/newproject.html',
+              width: 700,
+              height: 600,
+              resizable: false,
+              maximizable: false,
+              parent: mainWindow
+            })
+            await mainWindow.setClosable(false)
+            await mainWindow.setEnabled(false)
+            await popup.setFocus()
+            popup.once('tauri://destroyed', async () => {
+              await mainWindow.setEnabled(true)
+              await mainWindow.setClosable(true)
+              await mainWindow.setFocus()
+            })
+          }}
+        >
+          New Project
+        </button>
         <button>Open</button>
         <button>Clone Repository</button>
       </div>