fixed zip

Author: cyanff

@/components/ui/popover.tsx

@@ -0,0 +1,31 @@
+import * as React from "react"
+import * as PopoverPrimitive from "@radix-ui/react-popover"
+
+import { cn } from "@/lib/utils"
+
+const Popover = PopoverPrimitive.Root
+
+const PopoverTrigger = PopoverPrimitive.Trigger
+
+const PopoverAnchor = PopoverPrimitive.Anchor
+
+const PopoverContent = React.forwardRef<
+  React.ElementRef<typeof PopoverPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>
+>(({ className, align = "center", sideOffset = 4, ...props }, ref) => (
+  <PopoverPrimitive.Portal>
+    <PopoverPrimitive.Content
+      ref={ref}
+      align={align}
+      sideOffset={sideOffset}
+      className={cn(
+        "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        className
+      )}
+      {...props}
+    />
+  </PopoverPrimitive.Portal>
+))
+PopoverContent.displayName = PopoverPrimitive.Content.displayName
+
+export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor }

package-lock.json

@@ -95,8 +95,10 @@ export default function App() {
     try {
       for (let i = 0; i < numFiles; i++) {
         const file = files[i];
+
+        // FIXME: hacky, use a better method to detect zips
         // Reject files that are not .zip
-        if (file.type !== "application/zip") {
+        if (!file.type.includes("zip")) {
           toast.error(`${file.name} is not a zip file, skipping...`);
           continue;
         }

src/renderer/src/app/app.tsx

@@ -54,7 +54,7 @@ export default function SettingsChat() {
     syncSettings();
   }, []);
 
-  /* Set the form's values to be the user's settings.json */
+  // Set the form's values to be the user's settings.json
   const syncSettings = async () => {
     const res = await window.api.setting.get();
     if (res.kind === "err") {
@@ -134,6 +134,7 @@ export default function SettingsChat() {
                       render={({ field }) => (
                         <Combobox
                           items={models.map((model) => ({ name: model, value: model }))}
+                          disabled={true}
                           value={field.value}
                           setValue={(value) => {
                             setValue("model", value);

src/renderer/src/app/settings/settings_chat.tsx

@@ -26,7 +26,10 @@ export default function LogoButton({ className, rest }: LogoButtonProps) {
   return (
     <DropdownMenu>
       <DropdownMenuTrigger>
-        <button className={cn("h-9 w-16 rounded-full bg-logo-grad px-5 py-3", className)} {...rest}></button>
+        <button
+          className={cn("h-9 w-16 outline-none rounded-full bg-logo-grad px-5 py-3", className)}
+          {...rest}
+        ></button>
       </DropdownMenuTrigger>
       <DropdownMenuContent align="end">
         <div>

src/renderer/src/components/LogoButton.tsx

@@ -11,22 +11,28 @@ interface ComboBoxProps {
   setValue: (value: string) => void;
   placeholder?: string;
   emptyMessage?: string;
+  disabled?: boolean;
+  [key: string]: any;
 }
 
 export default function Combobox({
   items,
   value,
   setValue,
   placeholder = "",
-  emptyMessage = "No results found"
+  emptyMessage = "No results found",
+  disabled,
+  ...rest
 }: ComboBoxProps) {
   const [open, setOpen] = React.useState(false);
 
   return (
     <Popover open={open} onOpenChange={setOpen}>
-      <PopoverTrigger asChild>
-        <button className="flex h-12 w-full items-center border border-line justify-between rounded-lg bg-input-primary px-3 py-2 text-tx-primary">
-          <p className="line-clamp-1 text-ellipsis">
+      <PopoverTrigger asChild disabled={disabled} {...rest}>
+        <button
+          className={` flex h-12 w-full items-center border border-line justify-between rounded-lg ${disabled ? "bg-muted border-none" : "bg-input-primary"}  px-3 py-2 text-tx-primary `}
+        >
+          <p className="line-clamp-1 text-ellipsis" {...rest}>
             {value ? items.find((item) => item.value === value)?.name : placeholder}
           </p>
           <CaretSortIcon className="ml-2 h-4 w-4 shrink-0 opacity-50" />

src/renderer/src/components/ui/combobox.tsx

@@ -193,6 +193,8 @@
     --action-primary: hsl(340, 80%, 70%); /* Vibrant pink for primary action buttons */
     --action-secondary: hsl(340, 60%, 80%); /* Softer pink for secondary action buttons */
     --action-tertiary: hsl(340, 40%, 90%); /* Pale pink for tertiary action buttons */
+
+    --muted: hsl(0, 0%, 50%);
   }
 
   /* Artic dark theme */
@@ -323,6 +325,7 @@
     --action-primary: hsl(345, 77%, 48%);
     --action-secondary: hsl(230, 25%, 55%);
     --action-tertiary: hsl(230, 25%, 25%);
+
   }
 
   /* Twilight dark theme */

src/renderer/src/styles/global.css

@@ -68,6 +68,8 @@ module.exports = {
         line: "var(--line)",
         accent: "var(--accent)",
         float: "var(--float)",
+        muted: "var(--muted)",
+
         popover: {
           DEFAULT: "var(--popover)",
           foreground: "var(--popover-foreground)"