From 3ca1b7cd02081aa13e6da2024869adf78bb0fc82 Mon Sep 17 00:00:00 2001
From: "Ibrahima G. Coulibaly" <ibracool99@gmail.com>
Date: Sun, 23 Jun 2024 01:42:50 +0100
Subject: [PATCH] feat: copy and import file

---
 .idea/workspace.xml                    | 27 +++++++--------
 src/components/input/ToolTextInput.tsx | 46 ++++++++++++++++++++++++--
 src/pages/string/split/meta.ts         |  2 +-
 3 files changed, 58 insertions(+), 17 deletions(-)

diff --git a/.idea/workspace.xml b/.idea/workspace.xml
index cb0ccae..cf6cb57 100644
--- a/.idea/workspace.xml
+++ b/.idea/workspace.xml
@@ -4,18 +4,10 @@
     <option name="autoReloadType" value="SELECTIVE" />
   </component>
   <component name="ChangeListManager">
-    <list default="true" id="b30e2810-c4c1-4aad-b134-794e52cc1c7d" name="Changes" comment="fix: deploy message">
-      <change afterPath="$PROJECT_DIR$/src/components/index.css" afterDir="false" />
-      <change afterPath="$PROJECT_DIR$/src/utils/string.ts" afterDir="false" />
+    <list default="true" id="b30e2810-c4c1-4aad-b134-794e52cc1c7d" name="Changes" comment="chore: tools by category">
       <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/components/App.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/App.tsx" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/components/ToolHeader.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/ToolHeader.tsx" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/components/ToolLayout.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/ToolLayout.tsx" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/pages/home/index.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/home/index.tsx" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/pages/string/split/index.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/string/split/index.tsx" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/input/ToolTextInput.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/input/ToolTextInput.tsx" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/src/pages/string/split/meta.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/string/split/meta.ts" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/tools/defineTool.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/tools/defineTool.tsx" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/tools/index.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/tools/index.ts" afterDir="false" />
     </list>
     <option name="SHOW_DIALOG" value="false" />
     <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -137,7 +129,7 @@
       <workItem from="1719006951159" duration="2377000" />
       <workItem from="1719021128819" duration="3239000" />
       <workItem from="1719083989394" duration="7971000" />
-      <workItem from="1719092003308" duration="8256000" />
+      <workItem from="1719092003308" duration="9218000" />
     </task>
     <task id="LOCAL-00001" summary="feat: use vite and ts">
       <option name="closed" value="true" />
@@ -347,7 +339,15 @@
       <option name="project" value="LOCAL" />
       <updated>1719096551866</updated>
     </task>
-    <option name="localTasksCounter" value="27" />
+    <task id="LOCAL-00027" summary="chore: tools by category">
+      <option name="closed" value="true" />
+      <created>1719102365836</created>
+      <option name="number" value="00027" />
+      <option name="presentableId" value="LOCAL-00027" />
+      <option name="project" value="LOCAL" />
+      <updated>1719102365836</updated>
+    </task>
+    <option name="localTasksCounter" value="28" />
     <servers />
   </component>
   <component name="TypeScriptGeneratedFilesManager">
@@ -390,7 +390,8 @@
     <MESSAGE value="feat: tools normalized" />
     <MESSAGE value="feat: search tools" />
     <MESSAGE value="fix: deploy message" />
-    <option name="LAST_COMMIT_MESSAGE" value="fix: deploy message" />
+    <MESSAGE value="chore: tools by category" />
+    <option name="LAST_COMMIT_MESSAGE" value="chore: tools by category" />
   </component>
   <component name="XSLT-Support.FileAssociations.UIState">
     <expand />
diff --git a/src/components/input/ToolTextInput.tsx b/src/components/input/ToolTextInput.tsx
index 171c49c..3d27244 100644
--- a/src/components/input/ToolTextInput.tsx
+++ b/src/components/input/ToolTextInput.tsx
@@ -3,7 +3,8 @@ import Typography from '@mui/material/Typography';
 import Button from '@mui/material/Button';
 import PublishIcon from '@mui/icons-material/Publish';
 import ContentPasteIcon from '@mui/icons-material/ContentPaste';
-import React from 'react';
+import React, { useContext, useRef } from 'react';
+import { CustomSnackBarContext } from '../../contexts/CustomSnackBarContext';
 
 export default function ToolTextInput({
   value,
@@ -14,6 +15,34 @@ export default function ToolTextInput({
   value: string;
   onChange: (value: string) => void;
 }) {
+  const { showSnackBar } = useContext(CustomSnackBarContext);
+  const fileInputRef = useRef<HTMLInputElement>(null);
+
+  const handleCopy = () => {
+    navigator.clipboard
+      .writeText(value)
+      .then(() => showSnackBar('Text copied', 'success'))
+      .catch((err) => {
+        showSnackBar('Failed to copy: ', 'error');
+      });
+  };
+  const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    const file = event.target.files?.[0];
+    if (file) {
+      const reader = new FileReader();
+      reader.onload = (e) => {
+        const text = e.target?.result;
+        if (typeof text === 'string') {
+          onChange(text);
+        }
+      };
+      reader.readAsText(file);
+    }
+  };
+
+  const handleImportClick = () => {
+    fileInputRef.current?.click();
+  };
   return (
     <Box>
       <Typography fontSize={30} color={'primary'}>
@@ -27,9 +56,20 @@ export default function ToolTextInput({
         rows={10}
       />
       <Stack mt={1} direction={'row'} spacing={2}>
-        <Button startIcon={<PublishIcon />}>Import from file</Button>
-        <Button startIcon={<ContentPasteIcon />}>Copy to clipboard</Button>
+        <Button onClick={handleImportClick} startIcon={<PublishIcon />}>
+          Import from file
+        </Button>
+        <Button onClick={handleCopy} startIcon={<ContentPasteIcon />}>
+          Copy to clipboard
+        </Button>
       </Stack>
+      <input
+        type="file"
+        accept="*"
+        ref={fileInputRef}
+        style={{ display: 'none' }}
+        onChange={handleFileChange}
+      />
     </Box>
   );
 }
diff --git a/src/pages/string/split/meta.ts b/src/pages/string/split/meta.ts
index fb399a2..cfc92db 100644
--- a/src/pages/string/split/meta.ts
+++ b/src/pages/string/split/meta.ts
@@ -5,7 +5,7 @@ import image from '../../../assets/text.png';
 export const tool = defineTool('string', {
   path: 'split',
   name: 'Text splitter',
-  image: image,
+  image,
   description:
     "World's simplest browser-based utility for splitting text. Load your text in the input form on the left and you'll automatically get pieces of this text on the right. Powerful, free, and fast. Load text – get chunks.",
   keywords: ['text', 'split'],