nanostores hook & upload btn

src/components/Controlbar.tsx

@@ -1,10 +1,35 @@
-import { component$ } from "@builder.io/qwik";
+import { component$, useSignal } from "@builder.io/qwik";
+import { atom } from "nanostores";
+import { SolarUploadLinear } from "./Icons";
+
+const a = atom(0);
 
-// TODO: add upload button and other stuff fr
 export default component$(() => {
+    const fileInputRef = useSignal<HTMLInputElement>();
+    
     return (
-        <div class="absolute fixed bottom-4 left-1/2 transform -translate-x-1/2 bg-red-400 w-1/4 p-4 rounded-lg flex items-center justify-center">
-            hi
+        <div class="fixed bottom-4 left-1/2 transform -translate-x-1/2 bg-red-400 w-1/3 p-2 rounded-lg flex items-center justify-start">
+            {/* Hidden file input */}
+            <input 
+                type="file" 
+                ref={fileInputRef}
+                style="display: none;"
+                onChange$={(e) => {
+                    // You can handle the selected file here or emit an event
+                    const files = (e.target as HTMLInputElement).files;
+                    if (files && files.length > 0) {
+                        console.log("File selected:", files[0]);
+                    }
+                }}
+            />
+            
+            {/* Button that triggers the file dialog */}
+            <button
+                class="duration-100 hover:bg-white p-2 rounded-lg"
+                onClick$={() => { fileInputRef.value?.click() }}
+            >
+                <SolarUploadLinear class="w-6 h-6 text-black" />
+            </button>
         </div>
     )
 })

src/components/Icons.tsx

@@ -0,0 +1,7 @@
+import { QwikIntrinsicElements } from "@builder.io/qwik";
+
+export function SolarUploadLinear(props: QwikIntrinsicElements['svg'], key: string) {
+  return (
+    <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" {...props} key={key}><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="1.5"><path d="M17 9.002c2.175.012 3.353.109 4.121.877C22 10.758 22 12.172 22 15v1c0 2.829 0 4.243-.879 5.122C20.243 22 18.828 22 16 22H8c-2.828 0-4.243 0-5.121-.878C2 20.242 2 18.829 2 16v-1c0-2.828 0-4.242.879-5.121c.768-.768 1.946-.865 4.121-.877"></path><path stroke-linejoin="round" d="M12 15V2m0 0l3 3.5M12 2L9 5.5"></path></g></svg>
+  )
+}