fix: replace the useLocalStorage

components/ActionsAfterResult.tsx

@@ -1,8 +1,8 @@
 import Image from "next/image";
 import Link from "next/link";
 import React from "react";
-import { useLocalStorage } from "react-use";
 import { useSaveToFlomo } from "~/hooks/notes/flomo";
+import { useLocalStorage } from "~/hooks/useLocalStorage";
 
 export function ActionsAfterResult({
   curVideo,

hooks/useLocalStorage.ts

@@ -1,6 +1,6 @@
 import React from 'react'
 
-export function useLocalStorage<T>(key: string, initialValue: T) {
+export function useLocalStorage<T>(key: string, initialValue?: T) {
   // State to store our value
   // Pass initial state function to useState so logic is only executed once
   const [storedValue, setStoredValue] = React.useState<T>(() => {

pages/[...slug].tsx

@@ -2,7 +2,6 @@ import type { NextPage } from "next";
 import { useSearchParams } from "next/navigation";
 import { useRouter } from "next/router";
 import React, { useEffect, useState } from "react";
-import { useLocalStorage } from "react-use";
 import { useAnalytics } from "~/components/context/analytics";
 import { SubmitButton } from "~/components/SubmitButton";
 import { SummaryResult } from "~/components/SummaryResult";
@@ -17,6 +16,7 @@ import { VideoService } from "~/lib/types";
 import { extractUrl } from "~/utils/extractUrl";
 import { getVideoIdFromUrl } from "~/utils/getVideoIdFromUrl";
 import getVideoId from "get-video-id";
+import { useLocalStorage } from "~/hooks/useLocalStorage";
 
 export const Home: NextPage<{
   showSingIn: (show: boolean) => void;
@@ -31,7 +31,7 @@ export const Home: NextPage<{
   const [currentVideoUrl, setCurrentVideoUrl] = useState<string>("");
   const [shouldShowTimestamp, setShouldShowTimestamp] =
     useLocalStorage<boolean>("should-show-timestamp");
-  const [userKey, setUserKey, remove] =
+  const [userKey, setUserKey] =
     useLocalStorage<string>("user-openai-apikey");
   const { loading, summary, resetSummary, summarize } =
     useSummarize(showSingIn);
@@ -115,9 +115,6 @@ export const Home: NextPage<{
     analytics.track("GenerateButton Clicked");
   };
   const handleApiKeyChange = (e: any) => {
-    if (!e.target.value) {
-      remove();
-    }
     setUserKey(e.target.value);
   };
 

pages/user/integration.tsx

@@ -1,15 +1,12 @@
 import React from "react";
-import { useLocalStorage } from "react-use";
 import { Sidebar } from "~/components/sidebar";
+import { useLocalStorage } from "~/hooks/useLocalStorage";
 
 export default () => {
-  const [flomoWebhook, setFlomoWebhook, remove] =
+  const [flomoWebhook, setFlomoWebhook] =
     useLocalStorage<string>("user-flomo-webhook");
 
   const handleFlomoWebhook = (e: any) => {
-    if (!e.target.value) {
-      remove();
-    }
     setFlomoWebhook(e.target.value);
   };