Fix/todo tags && handling error while copying (#100)

Co-authored-by: Ryczko <konradryczko1@gmail.com>
Ryczko · Mar 22, 2023 · edfcd4a · edfcd4a
1 parent 1dce63d
commit edfcd4a
Show file tree

Hide file tree

Showing 6 changed files with 25 additions and 27 deletions.
diff --git a/src/features/settings/settingsManager.ts b/src/features/settings/settingsManager.ts
@@ -57,7 +57,6 @@ export const useSettingsManager = () => {
       signOut(auth);
     } catch (error) {
       toast.error('Error deleting account');
-      console.error(error);
     }
     setIsRemoving(false);
   };

diff --git a/src/features/surveys/components/SurveyRow/SurveyRow.tsx b/src/features/surveys/components/SurveyRow/SurveyRow.tsx
@@ -25,7 +25,7 @@ export default function SurveyRow({
   endDate,
   id,
 }: SurveyRowProps) {
-  const [, copy] = useCopyToClipboard();
+  const { copy } = useCopyToClipboard();
   const navigate = useRouter();
   const [isOpen, setIsOpen] = useState(false);
   const [isRemoving, setIsRemoving] = useState(false);
@@ -43,7 +43,6 @@ export default function SurveyRow({
       window.location.hostname === 'localhost' ? 'http://' : 'https://';
     const link = `${domain}${window.location.host}/survey/${id}`;
     copy(link);
-    toast.success('Link copied to clipboard');
   };
 
   const handleOnMoreButton = () => {
@@ -58,7 +57,6 @@ export default function SurveyRow({
       toast.success('Survey deleted');
     } catch (error) {
       toast.error('Error deleting survey');
-      console.error(error);
     }
     setIsRemoving(false);
   };

diff --git a/src/features/surveys/managers/createSurveyManager.ts b/src/features/surveys/managers/createSurveyManager.ts
@@ -15,7 +15,7 @@ export const useCreateSurveyManager = () => {
   const [isCreating, setIsCreating] = useState(false);
 
   const router = useRouter();
-  const [, copy] = useCopyToClipboard();
+  const { copy } = useCopyToClipboard();
 
   // Move to useState initial value when bug in emoji library will be solved:
   // https://github.com/ealush/emoji-picker-react/issues/329
@@ -61,10 +61,13 @@ export const useCreateSurveyManager = () => {
       const domain =
         window.location.hostname === 'localhost' ? 'http://' : 'https://';
       const link = `${domain}${window.location.host}/survey/${newSurvey.id}`;
-      copy(link);
+      const copiedCorrectly = await copy(link, true);
       await router.push(`/survey/answer/${newSurvey.id}`);
-
-      toast.success('Survey created and link copied to clipboard');
+      toast.success(
+        `Survey created succesfully ${
+          copiedCorrectly ? 'and link copied to clipboard' : ''
+        }`
+      );
     } catch (error) {
       toast.error('Survey creation failed');
     }

diff --git a/src/features/surveys/managers/surveyResultsManager.ts b/src/features/surveys/managers/surveyResultsManager.ts
@@ -26,7 +26,7 @@ export const useSurveyResultsManager = () => {
   const [startDate, setStartDate] = useState('-');
   const [endDate, setEndDate] = useState('-');
   const [answersData, setAnswersData] = useState<AnswerData[]>([]);
-  const [, copy] = useCopyToClipboard();
+  const { copy } = useCopyToClipboard();
 
   const getSurveyData = useCallback(
     async (displayMessages = false) => {
@@ -121,7 +121,6 @@ export const useSurveyResultsManager = () => {
       window.location.hostname === 'localhost' ? 'http://' : 'https://';
     const link = `${domain}${window.location.host}/survey/${id}`;
     copy(link);
-    toast.success('Link copied to clipboard');
   };
 
   return {

diff --git a/src/pages/surveys/index.tsx b/src/pages/surveys/index.tsx
@@ -24,14 +24,12 @@ function SurveyListPage() {
 
         <div className="flex flex-col items-center justify-center">
           <div>
-            {
-              // TODO: add user friendly error message
-              error && <strong>Error: {JSON.stringify(error)}</strong>
-            }
-            {
-              // TODO: add fancy loading
-              loading && <Loader isLoading={true} />
-            }
+            {error && (
+              <strong>
+                There is a problem - your surveys cannot be viewed.
+              </strong>
+            )}
+            {loading && <Loader isLoading={true} />}
           </div>
           {surveysCollection &&
             (surveysCollection.docs?.length > 0 ? (

diff --git a/src/shared/hooks/useCopyToClipboard.ts b/src/shared/hooks/useCopyToClipboard.ts
@@ -1,29 +1,30 @@
 import { useState } from 'react';
+import toast from 'react-hot-toast';
 
-type CopiedValue = string | null;
-type CopyFn = (text: string) => Promise<boolean>;
+function useCopyToClipboard() {
+  const [copiedText, setCopiedText] = useState<string | null>(null);
 
-function useCopyToClipboard(): [CopiedValue, CopyFn] {
-  const [copiedText, setCopiedText] = useState<CopiedValue>(null);
-
-  const copy: CopyFn = async (text) => {
+  const copy = async (text: string, silient = false) => {
     if (!navigator?.clipboard) {
-      console.warn('Clipboard not supported');
+      toast.error('Clipboard not supported');
       return false;
     }
 
     try {
       await navigator.clipboard.writeText(text);
       setCopiedText(text);
+      if (!silient) {
+        toast.success('Copied to clipboard');
+      }
       return true;
     } catch (error) {
-      console.warn('Copy failed', error);
+      toast.error('Copy failed');
       setCopiedText(null);
       return false;
     }
   };
 
-  return [copiedText, copy];
+  return { copiedText, copy };
 }
 
 export default useCopyToClipboard;