From df00c24ff6368e3b94067442be954e2e4447ca9f Mon Sep 17 00:00:00 2001
From: AJAmit17 <amitjagadeesh2004@gmail.com>
Date: Thu, 14 Mar 2024 19:06:14 +0530
Subject: [PATCH 1/3] Fix Search Bar Query Navigation

Fixed the search query in Search bar
---
 components/searchBar/index.tsx | 20 ++++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/components/searchBar/index.tsx b/components/searchBar/index.tsx
index beeedb19..704571c3 100644
--- a/components/searchBar/index.tsx
+++ b/components/searchBar/index.tsx
@@ -38,13 +38,21 @@ export default function SearchBar({
 
   function handleInput(event: FormEvent) {
     setQuery((event.target as HTMLInputElement).value);
+    const searchValue = (event.target as HTMLInputElement).value;
     // When input value is null, set error & empty state to `true` and do nothing.
 
-    if (!smallScreen)
-      debounce(() => {
-        router.push(`/search?q=${(event.target as HTMLInputElement).value}`);
-      });
-    if (!(event.target as HTMLInputElement).value) {
+    if (!smallScreen) {
+      if (searchValue) {
+        debounce(() => {
+          router.push(`/search?q=${searchValue}`);
+        });
+      } else {
+        debounce(() => {
+          router.push(`/`);
+        });
+      }
+    }
+    if (!searchValue) {
       setIsEmpty(true);
       setIsError(true);
       return;
@@ -53,7 +61,7 @@ export default function SearchBar({
     // When input value is not null, reset error & empty state to `false`.
     // And also debounce the router push.
     setIsError(false);
-    setIsEmpty(false);  
+    setIsEmpty(false);
   }
 
   function handleSubmit(event?: FormEvent) {

From 0b88ca281497fd7a47c718ee853c3122e243de93 Mon Sep 17 00:00:00 2001
From: AJAmit17 <amitjagadeesh2004@gmail.com>
Date: Sat, 16 Mar 2024 16:37:05 +0530
Subject: [PATCH 2/3] [FEATURE] Added Copy button with Toast notification

Added Copy Button which copies the code snippet and gives a toast notification saying Code is Copied.
---
 components/codePreview/index.tsx | 17 ++++++++++++++++-
 components/searchBar/index.tsx   | 18 +++++-------------
 hooks/toast-provider.tsx         |  7 +++++++
 package.json                     |  1 +
 pages/_app.tsx                   |  2 ++
 yarn.lock                        | 12 ++++++++++++
 6 files changed, 43 insertions(+), 14 deletions(-)
 create mode 100644 hooks/toast-provider.tsx

diff --git a/components/codePreview/index.tsx b/components/codePreview/index.tsx
index 59dbed5c..2f3d4680 100644
--- a/components/codePreview/index.tsx
+++ b/components/codePreview/index.tsx
@@ -1,4 +1,4 @@
-import React, { useRef, useState } from "react";
+import React, { useCallback, useRef, useState } from "react";
 import "highlight.js/styles/atom-one-light.css";
 import { Algorithm } from "lib/models";
 import {
@@ -27,7 +27,9 @@ import {
   MoreHoriz,
   OpenInNew,
   PlayArrow,
+  FileCopyOutlined,
 } from "@material-ui/icons";
+import { toast } from "react-hot-toast";
 import NextLink from "next/link";
 import { StringParam, useQueryParam, withDefault } from "next-query-params";
 import classes from "./style.module.css";
@@ -45,6 +47,12 @@ export default function CodePreview({ algorithm }: { algorithm: Algorithm }) {
   const fabRef = useRef();
   const [mobileMoreMenuOpen, setMobileMoreMenuOpen] = useState(false);
 
+  const copyCode = useCallback(async () => {
+    const codeText = document.querySelector(".style_pre__k555n")?.textContent;
+    await navigator.clipboard.writeText(codeText);
+    toast.success("Code Snippet Copied!");
+  }, []);
+
   return (
     <div className={`${classes.container}`}>
       <div className={classes.codeBox}>
@@ -86,6 +94,10 @@ export default function CodePreview({ algorithm }: { algorithm: Algorithm }) {
                 <Fullscreen />
                 <Typography>{t("fullscreen")}</Typography>
               </MenuItem>
+              <MenuItem onClick={() => copyCode()}>
+                <FileCopyOutlined />
+                <Typography>{t("Copy Code")}</Typography>
+              </MenuItem>
               <Link
                 href={implementations[selectedLanguague].url}
                 target="_blank"
@@ -101,6 +113,9 @@ export default function CodePreview({ algorithm }: { algorithm: Algorithm }) {
         ) : (
           <>
             <div className={classes.buttonsTop}>
+              <IconButton className={classes.copycode} onClick={copyCode}>
+                <FileCopyOutlined />
+              </IconButton>
               <Button
                 startIcon={<OpenInNew />}
                 href={implementations[selectedLanguague].url}
diff --git a/components/searchBar/index.tsx b/components/searchBar/index.tsx
index 704571c3..9a88ed86 100644
--- a/components/searchBar/index.tsx
+++ b/components/searchBar/index.tsx
@@ -38,21 +38,13 @@ export default function SearchBar({
 
   function handleInput(event: FormEvent) {
     setQuery((event.target as HTMLInputElement).value);
-    const searchValue = (event.target as HTMLInputElement).value;
     // When input value is null, set error & empty state to `true` and do nothing.
 
-    if (!smallScreen) {
-      if (searchValue) {
-        debounce(() => {
-          router.push(`/search?q=${searchValue}`);
-        });
-      } else {
-        debounce(() => {
-          router.push(`/`);
-        });
-      }
-    }
-    if (!searchValue) {
+    if (!smallScreen)
+      debounce(() => {
+        router.push(`/search?q=${(event.target as HTMLInputElement).value}`);
+      });
+    if (!(event.target as HTMLInputElement).value) {
       setIsEmpty(true);
       setIsError(true);
       return;
diff --git a/hooks/toast-provider.tsx b/hooks/toast-provider.tsx
new file mode 100644
index 00000000..563cdbad
--- /dev/null
+++ b/hooks/toast-provider.tsx
@@ -0,0 +1,7 @@
+"use client";
+
+import { Toaster } from "react-hot-toast";
+
+export default function ToastProvider() {
+  return <Toaster />;
+}
diff --git a/package.json b/package.json
index 32045bbf..217c0622 100644
--- a/package.json
+++ b/package.json
@@ -47,6 +47,7 @@
     "react": "^17.0.2",
     "react-devicons": "^2.11.0-rev.2",
     "react-dom": "^17.0.2",
+    "react-hot-toast": "^2.4.1",
     "rehype-highlight": "<5.0.0",
     "rehype-stringify": "<9.0.0",
     "remark-gfm": "<2.0.0",
diff --git a/pages/_app.tsx b/pages/_app.tsx
index ba595ca9..7a7343c9 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -11,6 +11,7 @@ import { QueryProvider } from "hooks/query";
 import { DarkThemeProvider } from "hooks/darkTheme";
 import DefaultLayout from "layouts/default";
 import { NextQueryParamProvider } from "next-query-params";
+import ToastProvider from "hooks/toast-provider";
 
 function MyApp({ Component, pageProps }: AppProps) {
   const [isDarkTheme, setIsDarkTheme] = useState(false);
@@ -32,6 +33,7 @@ function MyApp({ Component, pageProps }: AppProps) {
         <ThemeProvider theme={isDarkTheme ? darkTheme : lightTheme}>
           <QueryProvider>
             <NextQueryParamProvider>
+              <ToastProvider />
               <Head />
               <CssBaseline />
               <NextNprogress
diff --git a/yarn.lock b/yarn.lock
index 426736c6..9eb413ca 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2317,6 +2317,11 @@ globby@^11.1.0:
     merge2 "^1.4.1"
     slash "^3.0.0"
 
+goober@^2.1.10:
+  version "2.1.14"
+  resolved "https://registry.yarnpkg.com/goober/-/goober-2.1.14.tgz#4a5c94fc34dc086a8e6035360ae1800005135acd"
+  integrity sha512-4UpC0NdGyAFqLNPnhCT2iHpza2q+RAY3GV85a/mRPdzyPQMsj0KmMMuetdIkzWRbJ+Hgau1EZztq8ImmiMGhsg==
+
 has-bigints@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.1.tgz#64fe6acb020673e3b78db035a5af69aa9d07b113"
@@ -3802,6 +3807,13 @@ react-dom@^17.0.2:
     object-assign "^4.1.1"
     scheduler "^0.20.2"
 
+react-hot-toast@^2.4.1:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/react-hot-toast/-/react-hot-toast-2.4.1.tgz#df04295eda8a7b12c4f968e54a61c8d36f4c0994"
+  integrity sha512-j8z+cQbWIM5LY37pR6uZR6D4LfseplqnuAO4co4u8917hBUvXlEqyP1ZzqVLcqoyUesZZv/ImreoCeHVDpE5pQ==
+  dependencies:
+    goober "^2.1.10"
+
 react-i18next@^11.8.13:
   version "11.13.0"
   resolved "https://registry.yarnpkg.com/react-i18next/-/react-i18next-11.13.0.tgz#7b6f23f717154a44cf3f70d62a9368152bf8a73f"

From 4647f4ebbc4f1526c96c501316e1662ea6656433 Mon Sep 17 00:00:00 2001
From: AJAmit17 <amitjagadeesh2004@gmail.com>
Date: Sat, 16 Mar 2024 16:43:17 +0530
Subject: [PATCH 3/3] Revert "[FEATURE] Added Copy button with Toast
 notification"

This reverts commit 0b88ca281497fd7a47c718ee853c3122e243de93.
---
 components/codePreview/index.tsx | 17 +----------------
 components/searchBar/index.tsx   | 18 +++++++++++++-----
 hooks/toast-provider.tsx         |  7 -------
 package.json                     |  1 -
 pages/_app.tsx                   |  2 --
 yarn.lock                        | 12 ------------
 6 files changed, 14 insertions(+), 43 deletions(-)
 delete mode 100644 hooks/toast-provider.tsx

diff --git a/components/codePreview/index.tsx b/components/codePreview/index.tsx
index 2f3d4680..59dbed5c 100644
--- a/components/codePreview/index.tsx
+++ b/components/codePreview/index.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useRef, useState } from "react";
+import React, { useRef, useState } from "react";
 import "highlight.js/styles/atom-one-light.css";
 import { Algorithm } from "lib/models";
 import {
@@ -27,9 +27,7 @@ import {
   MoreHoriz,
   OpenInNew,
   PlayArrow,
-  FileCopyOutlined,
 } from "@material-ui/icons";
-import { toast } from "react-hot-toast";
 import NextLink from "next/link";
 import { StringParam, useQueryParam, withDefault } from "next-query-params";
 import classes from "./style.module.css";
@@ -47,12 +45,6 @@ export default function CodePreview({ algorithm }: { algorithm: Algorithm }) {
   const fabRef = useRef();
   const [mobileMoreMenuOpen, setMobileMoreMenuOpen] = useState(false);
 
-  const copyCode = useCallback(async () => {
-    const codeText = document.querySelector(".style_pre__k555n")?.textContent;
-    await navigator.clipboard.writeText(codeText);
-    toast.success("Code Snippet Copied!");
-  }, []);
-
   return (
     <div className={`${classes.container}`}>
       <div className={classes.codeBox}>
@@ -94,10 +86,6 @@ export default function CodePreview({ algorithm }: { algorithm: Algorithm }) {
                 <Fullscreen />
                 <Typography>{t("fullscreen")}</Typography>
               </MenuItem>
-              <MenuItem onClick={() => copyCode()}>
-                <FileCopyOutlined />
-                <Typography>{t("Copy Code")}</Typography>
-              </MenuItem>
               <Link
                 href={implementations[selectedLanguague].url}
                 target="_blank"
@@ -113,9 +101,6 @@ export default function CodePreview({ algorithm }: { algorithm: Algorithm }) {
         ) : (
           <>
             <div className={classes.buttonsTop}>
-              <IconButton className={classes.copycode} onClick={copyCode}>
-                <FileCopyOutlined />
-              </IconButton>
               <Button
                 startIcon={<OpenInNew />}
                 href={implementations[selectedLanguague].url}
diff --git a/components/searchBar/index.tsx b/components/searchBar/index.tsx
index 9a88ed86..704571c3 100644
--- a/components/searchBar/index.tsx
+++ b/components/searchBar/index.tsx
@@ -38,13 +38,21 @@ export default function SearchBar({
 
   function handleInput(event: FormEvent) {
     setQuery((event.target as HTMLInputElement).value);
+    const searchValue = (event.target as HTMLInputElement).value;
     // When input value is null, set error & empty state to `true` and do nothing.
 
-    if (!smallScreen)
-      debounce(() => {
-        router.push(`/search?q=${(event.target as HTMLInputElement).value}`);
-      });
-    if (!(event.target as HTMLInputElement).value) {
+    if (!smallScreen) {
+      if (searchValue) {
+        debounce(() => {
+          router.push(`/search?q=${searchValue}`);
+        });
+      } else {
+        debounce(() => {
+          router.push(`/`);
+        });
+      }
+    }
+    if (!searchValue) {
       setIsEmpty(true);
       setIsError(true);
       return;
diff --git a/hooks/toast-provider.tsx b/hooks/toast-provider.tsx
deleted file mode 100644
index 563cdbad..00000000
--- a/hooks/toast-provider.tsx
+++ /dev/null
@@ -1,7 +0,0 @@
-"use client";
-
-import { Toaster } from "react-hot-toast";
-
-export default function ToastProvider() {
-  return <Toaster />;
-}
diff --git a/package.json b/package.json
index 217c0622..32045bbf 100644
--- a/package.json
+++ b/package.json
@@ -47,7 +47,6 @@
     "react": "^17.0.2",
     "react-devicons": "^2.11.0-rev.2",
     "react-dom": "^17.0.2",
-    "react-hot-toast": "^2.4.1",
     "rehype-highlight": "<5.0.0",
     "rehype-stringify": "<9.0.0",
     "remark-gfm": "<2.0.0",
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 7a7343c9..ba595ca9 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -11,7 +11,6 @@ import { QueryProvider } from "hooks/query";
 import { DarkThemeProvider } from "hooks/darkTheme";
 import DefaultLayout from "layouts/default";
 import { NextQueryParamProvider } from "next-query-params";
-import ToastProvider from "hooks/toast-provider";
 
 function MyApp({ Component, pageProps }: AppProps) {
   const [isDarkTheme, setIsDarkTheme] = useState(false);
@@ -33,7 +32,6 @@ function MyApp({ Component, pageProps }: AppProps) {
         <ThemeProvider theme={isDarkTheme ? darkTheme : lightTheme}>
           <QueryProvider>
             <NextQueryParamProvider>
-              <ToastProvider />
               <Head />
               <CssBaseline />
               <NextNprogress
diff --git a/yarn.lock b/yarn.lock
index 9eb413ca..426736c6 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2317,11 +2317,6 @@ globby@^11.1.0:
     merge2 "^1.4.1"
     slash "^3.0.0"
 
-goober@^2.1.10:
-  version "2.1.14"
-  resolved "https://registry.yarnpkg.com/goober/-/goober-2.1.14.tgz#4a5c94fc34dc086a8e6035360ae1800005135acd"
-  integrity sha512-4UpC0NdGyAFqLNPnhCT2iHpza2q+RAY3GV85a/mRPdzyPQMsj0KmMMuetdIkzWRbJ+Hgau1EZztq8ImmiMGhsg==
-
 has-bigints@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.1.tgz#64fe6acb020673e3b78db035a5af69aa9d07b113"
@@ -3807,13 +3802,6 @@ react-dom@^17.0.2:
     object-assign "^4.1.1"
     scheduler "^0.20.2"
 
-react-hot-toast@^2.4.1:
-  version "2.4.1"
-  resolved "https://registry.yarnpkg.com/react-hot-toast/-/react-hot-toast-2.4.1.tgz#df04295eda8a7b12c4f968e54a61c8d36f4c0994"
-  integrity sha512-j8z+cQbWIM5LY37pR6uZR6D4LfseplqnuAO4co4u8917hBUvXlEqyP1ZzqVLcqoyUesZZv/ImreoCeHVDpE5pQ==
-  dependencies:
-    goober "^2.1.10"
-
 react-i18next@^11.8.13:
   version "11.13.0"
   resolved "https://registry.yarnpkg.com/react-i18next/-/react-i18next-11.13.0.tgz#7b6f23f717154a44cf3f70d62a9368152bf8a73f"