chore: handle enter press on search

2025-09-15 20:19:31 +02:00 · 2025-02-27 00:09:15 +00:00
parent d4345c33a3
commit a03df0a4e8
3 changed files with 50 additions and 33 deletions
--- a/.idea/workspace.xml
+++ b/.idea/workspace.xml
@@ -4,9 +4,10 @@
    <option name="autoReloadType" value="SELECTIVE" />
  </component>
  <component name="ChangeListManager">
-    <list default="true" id="b30e2810-c4c1-4aad-b134-794e52cc1c7d" name="Changes" comment="fix: bg">
+    <list default="true" id="b30e2810-c4c1-4aad-b134-794e52cc1c7d" name="Changes" comment="docs: readme">
      <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" 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$/README.md" beforeDir="false" afterPath="$PROJECT_DIR$/README.md" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/Hero.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Hero.tsx" afterDir="false" />
    </list>
    <option name="SHOW_DIALOG" value="false" />
    <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -117,11 +118,11 @@
      <recent name="C:\Users\HP\IdeaProjects\omni-tools\src\pages\string" />
    </key>
    <key name="MoveFile.RECENT_KEYS">
+      <recent name="C:\Users\Ibrahima\IdeaProjects\omni-tools\public\assets" />
      <recent name="C:\Users\Ibrahima\IdeaProjects\omni-tools\src\pages\tools" />
      <recent name="C:\Users\Ibrahima\IdeaProjects\omni-tools\src\pages\categories" />
      <recent name="C:\Users\HP\IdeaProjects\omni-tools\src\components" />
      <recent name="C:\Users\HP\IdeaProjects\omni-tools\src\components\options" />
-      <recent name="C:\Users\HP\IdeaProjects\omni-tools\src\pages\images\png\change-colors-in-png" />
    </key>
  </component>
  <component name="RunManager" selected="npm.dev">
@@ -259,31 +260,9 @@
      <workItem from="1740459961271" duration="66000" />
      <workItem from="1740460036909" duration="8299000" />
      <workItem from="1740490890760" duration="1889000" />
-      <workItem from="1740503199053" duration="1893000" />
-    </task>
-    <task id="LOCAL-00074" summary="fix: radio and list sort init">
-      <option name="closed" value="true" />
-      <created>1719516424652</created>
-      <option name="number" value="00074" />
-      <option name="presentableId" value="LOCAL-00074" />
-      <option name="project" value="LOCAL" />
-      <updated>1719516424652</updated>
-    </task>
-    <task id="LOCAL-00075" summary="chore: formik updateField">
-      <option name="closed" value="true" />
-      <created>1719519913328</created>
-      <option name="number" value="00075" />
-      <option name="presentableId" value="LOCAL-00075" />
-      <option name="project" value="LOCAL" />
-      <updated>1719519913328</updated>
-    </task>
-    <task id="LOCAL-00076" summary="ci: run e2e tests">
-      <option name="closed" value="true" />
-      <created>1719586077004</created>
-      <option name="number" value="00076" />
-      <option name="presentableId" value="LOCAL-00076" />
-      <option name="project" value="LOCAL" />
-      <updated>1719586077005</updated>
+      <workItem from="1740503199053" duration="4853000" />
+      <workItem from="1740584243965" duration="17000" />
+      <workItem from="1740613094492" duration="1804000" />
    </task>
    <task id="LOCAL-00077" summary="ci: run e2e tests">
      <option name="closed" value="true" />
@@ -653,7 +632,31 @@
      <option name="project" value="LOCAL" />
      <updated>1740504100676</updated>
    </task>
-    <option name="localTasksCounter" value="123" />
+    <task id="LOCAL-00123" summary="fix: bg">
+      <option name="closed" value="true" />
+      <created>1740505390205</created>
+      <option name="number" value="00123" />
+      <option name="presentableId" value="LOCAL-00123" />
+      <option name="project" value="LOCAL" />
+      <updated>1740505390205</updated>
+    </task>
+    <task id="LOCAL-00124" summary="docs: readme">
+      <option name="closed" value="true" />
+      <created>1740614012237</created>
+      <option name="number" value="00124" />
+      <option name="presentableId" value="LOCAL-00124" />
+      <option name="project" value="LOCAL" />
+      <updated>1740614012237</updated>
+    </task>
+    <task id="LOCAL-00125" summary="docs: readme">
+      <option name="closed" value="true" />
+      <created>1740614185980</created>
+      <option name="number" value="00125" />
+      <option name="presentableId" value="LOCAL-00125" />
+      <option name="project" value="LOCAL" />
+      <updated>1740614185980</updated>
+    </task>
+    <option name="localTasksCounter" value="126" />
    <servers />
  </component>
  <component name="TypeScriptGeneratedFilesManager">
@@ -685,7 +688,6 @@
    <option name="CHECK_CODE_SMELLS_BEFORE_PROJECT_COMMIT" value="false" />
    <option name="CHECK_NEW_TODO" value="false" />
    <option name="ADD_EXTERNAL_FILES_SILENTLY" value="true" />
-    <MESSAGE value="feat: find unique ui" />
    <MESSAGE value="feat: group list ui" />
    <MESSAGE value="feat: reverse list ui" />
    <MESSAGE value="feat: self host" />
@@ -710,7 +712,8 @@
    <MESSAGE value="style: background svg" />
    <MESSAGE value="docs: img" />
    <MESSAGE value="fix: bg" />
-    <option name="LAST_COMMIT_MESSAGE" value="fix: bg" />
+    <MESSAGE value="docs: readme" />
+    <option name="LAST_COMMIT_MESSAGE" value="docs: readme" />
  </component>
  <component name="XSLT-Support.FileAssociations.UIState">
    <expand />
--- a/README.md
+++ b/README.md
@@ -22,7 +22,7 @@
 </p>

 Welcome to OmniTools, a self-hosted web app offering a variety of online tools to simplify everyday tasks.
-Whether you are coding, manipulating images, crunching numbers, or OmniTools has you covered. Please don't forget to
+Whether you are coding, manipulating images or crunching numbers, OmniTools has you covered. Please don't forget to
 star the repo to support us.
 Here is the [demo](https://omnitools.netlify.app/) website.

--- a/src/components/Hero.tsx
+++ b/src/components/Hero.tsx
@@ -2,7 +2,7 @@ import { Autocomplete, Box, Stack, TextField } from '@mui/material';
 import Typography from '@mui/material/Typography';
 import SearchIcon from '@mui/icons-material/Search';
 import Grid from '@mui/material/Grid';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import { DefinedTool } from '@tools/defineTool';
 import { filterTools, tools } from '@tools/index';
 import { useNavigate } from 'react-router-dom';
@@ -27,6 +27,7 @@ export default function Hero() {
  const [filteredTools, setFilteredTools] = useState<DefinedTool[]>(
    _.shuffle(tools)
  );
+  const [pendingNavigation, setPendingNavigation] = useState<boolean>(false);
  const navigate = useNavigate();
  const handleInputChange = (
    event: React.ChangeEvent<{}>,
@@ -35,6 +36,14 @@ export default function Hero() {
    setInputValue(newInputValue);
    setFilteredTools(_.shuffle(filterTools(tools, newInputValue)));
  };
+
+  useEffect(() => {
+    if (pendingNavigation && filteredTools.length > 0) {
+      navigate('/' + filteredTools[0].path);
+      setPendingNavigation(false);
+    }
+  }, [pendingNavigation, filteredTools, navigate]);
+
  return (
    <Box width={{ xs: '90%', md: '80%', lg: '60%' }}>
      <Stack mb={1} direction={'row'} spacing={1} justifyContent={'center'}>
@@ -94,6 +103,11 @@ export default function Hero() {
            </Box>
          </Box>
        )}
+        onKeyDown={(event) => {
+          if (event.key === 'Enter') {
+            setPendingNavigation(true);
+          }
+        }}
      />
      <Grid container spacing={2} mt={2}>
        {exampleTools.map((tool) => (