Merge pull request #21 from e-roy/update-packages

e-roy · May 13, 2024 · e37d3f0 · e37d3f0
2 parents de737ae + b92428b
commit e37d3f0
Show file tree

Hide file tree

Showing 7 changed files with 202 additions and 127 deletions.
diff --git a/package.json b/package.json
@@ -9,20 +9,20 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@google/generative-ai": "^0.2.0",
+    "@google/generative-ai": "^0.11.1",
     "@radix-ui/react-accordion": "^1.1.2",
     "@radix-ui/react-dropdown-menu": "^2.0.6",
     "@radix-ui/react-hover-card": "^1.0.7",
     "@radix-ui/react-icons": "^1.3.0",
     "@radix-ui/react-label": "^2.0.2",
     "@radix-ui/react-slider": "^1.1.2",
     "@radix-ui/react-slot": "^1.0.2",
-    "ai": "^2.2.33",
+    "ai": "^3.1.5",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
     "html-escaper": "^3.0.3",
-    "lucide-react": "^0.297.0",
-    "next": "^14.1.0",
+    "lucide-react": "^0.378.0",
+    "next": "^14.2.3",
     "next-themes": "^0.2.1",
     "react": "^18",
     "react-dom": "^18",
@@ -46,7 +46,7 @@
     "eslint": "^8",
     "eslint-config-next": "14.0.4",
     "postcss": "^8",
-    "tailwindcss": "^3.3.0",
+    "tailwindcss": "^3.4.3",
     "typescript": "^5"
   }
 }
diff --git a/src/app/error.tsx b/src/app/error.tsx
@@ -3,7 +3,7 @@
 import { Button } from "@/components/ui/button";
 import React from "react";
 
-export default function Error({ error, reset }: any) {
+export default function ErrorPage({ error, reset }: any) {
   React.useEffect(() => {
     console.log("logging error:", error);
   }, [error]);

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -15,7 +15,7 @@ export const metadata: Metadata = {
 export default function RootLayout({
   children,
 }: {
-  children: React.ReactNode;
+  readonly children: React.ReactNode;
 }) {
   return (
     <html lang="en" suppressHydrationWarning>

diff --git a/src/components/control/SafetySelector.tsx b/src/components/control/SafetySelector.tsx
@@ -10,17 +10,27 @@ import {
 import { Label } from "@/components/ui/label";
 import { Slider } from "@/components/ui/slider";
 
+const safetyLevels = ["none", "few", "some", "most"] as const;
+
+type SafetyLevel = (typeof safetyLevels)[number];
+
+const getSafetyLevel = (value: number): SafetyLevel => {
+  return safetyLevels[value] || "none";
+};
+
 interface SafetySelectorProps {
-  label: string;
-  value: number;
-  onValueChange: (newValue: number[]) => void;
+  readonly label: string;
+  readonly value: number;
+  readonly onValueChange: (newValue: number[]) => void;
 }
 
 export function SafetySelector({
   label,
   value,
   onValueChange,
 }: SafetySelectorProps) {
+  const safetyLevel = getSafetyLevel(value);
+
   return (
     <div className="grid gap-2 pt-2">
       <HoverCard openDelay={200}>
@@ -29,13 +39,7 @@ export function SafetySelector({
             <div className="flex items-center justify-between">
               <Label htmlFor={label}>{label}</Label>
               <span className="w-12 rounded-md border border-transparent px-2 py-0.5 text-right text-sm text-muted-foreground hover:border-border">
-                {value === 0
-                  ? "none"
-                  : value === 1
-                  ? "few"
-                  : value === 2
-                  ? "some"
-                  : "most"}
+                {safetyLevel}
               </span>
             </div>
             <Slider

diff --git a/src/components/control/SettingsSelector.tsx b/src/components/control/SettingsSelector.tsx
@@ -10,12 +10,12 @@ import { Label } from "@/components/ui/label";
 import { Slider } from "@/components/ui/slider";
 
 interface SettingsSelectorProps {
-  label: string;
-  hoverText: string;
-  step: number;
-  max: number;
-  value: number;
-  onValueChange: (newValue: number[]) => void;
+  readonly label: string;
+  readonly hoverText: string;
+  readonly step: number;
+  readonly max: number;
+  readonly value: number;
+  readonly onValueChange: (newValue: number[]) => void;
 }
 
 export function SettingsSelector({

diff --git a/src/providers/ControlContext/index.tsx b/src/providers/ControlContext/index.tsx
@@ -1,6 +1,6 @@
 "use client";
 // providers/ControlContext.tsx
-import { createContext, useState, useContext, ReactNode } from "react";
+import { createContext, useState, useContext, ReactNode, useMemo } from "react";
 
 import { MediaData, SafetySettings, GeneralSettings } from "@/types";
 
@@ -84,20 +84,23 @@ export const ControlProvider = ({ children }: { children: ReactNode }) => {
     });
   };
 
+  const contextValue = useMemo(
+    () => ({
+      selectedModel,
+      mediaDataList,
+      handleMediaUpload,
+      removeMediaData,
+      generalSettings,
+      handleGeneralSettingsChange,
+      safetySettings,
+      handleModelChange,
+      handleSafetyChange,
+    }),
+    [selectedModel, mediaDataList, generalSettings, safetySettings]
+  );
+
   return (
-    <ControlContext.Provider
-      value={{
-        selectedModel,
-        mediaDataList,
-        handleMediaUpload,
-        removeMediaData,
-        generalSettings,
-        handleGeneralSettingsChange,
-        safetySettings,
-        handleModelChange,
-        handleSafetyChange,
-      }}
-    >
+    <ControlContext.Provider value={contextValue}>
       {children}
     </ControlContext.Provider>
   );