fix: cancel submit event of the form tag and small adjust in paddin…

…g value of the `Container` component

CHANGELOG.md

@@ -1,15 +1,13 @@
 # [1.2.0](https://github.com/ArtelierMaisa/artelier-maisa-admin/compare/v1.1.0...v1.2.0) (2024-07-03)
 
-
 ### Features
 
-* add `meta` tags to show platform preview ([3f4461b](https://github.com/ArtelierMaisa/artelier-maisa-admin/commit/3f4461b4ee12605ae15d8fc8bc915937f71762b4))
-
+- add `meta` tags to show platform preview ([3f4461b](https://github.com/ArtelierMaisa/artelier-maisa-admin/commit/3f4461b4ee12605ae15d8fc8bc915937f71762b4))
 
 ### Performance Improvements
 
-* change all components to use `memo` to improve application performance ([d2907ff](https://github.com/ArtelierMaisa/artelier-maisa-admin/commit/d2907ff0d012c820dc303d49375f00de83426d17))
-* improve search category by name in `onSearch` function ([c8fed3d](https://github.com/ArtelierMaisa/artelier-maisa-admin/commit/c8fed3d936c50111f4bd2051d4a1ecdefbcfd974))
+- change all components to use `memo` to improve application performance ([d2907ff](https://github.com/ArtelierMaisa/artelier-maisa-admin/commit/d2907ff0d012c820dc303d49375f00de83426d17))
+- improve search category by name in `onSearch` function ([c8fed3d](https://github.com/ArtelierMaisa/artelier-maisa-admin/commit/c8fed3d936c50111f4bd2051d4a1ecdefbcfd974))
 
 # [1.1.0](https://github.com/ArtelierMaisa/artelier-maisa-admin/compare/v1.0.0...v1.1.0) (2024-07-03)
 

src/components/Container/index.tsx

@@ -6,7 +6,7 @@ function Container(props: ContainerProps) {
   const { children } = props;
 
   return (
-    <main className='flex flex-col w-full h-screen ml-[3.25rem] sm:ml-0 p-2 sm:p-5 overflow-y-auto'>
+    <main className='flex flex-col w-full h-screen ml-[3.25rem] sm:ml-0 p-3 sm:p-5 overflow-y-auto'>
       {children}
     </main>
   );

src/components/SearchInput/index.tsx

@@ -1,14 +1,23 @@
-import { memo } from 'react';
+import { FormEvent, memo } from 'react';
 
 import { SearchInputProps } from '../../@types';
 import { GenericButton, Icon } from '../';
 
 function SearchInput(props: SearchInputProps) {
   const { searchValue, onChange, onSearch } = props;
 
+  function onSubmit(event: FormEvent<HTMLFormElement>): void {
+    event.preventDefault();
+
+    if (onSearch) onSearch();
+  }
+
   return (
     <>
-      <form className='w-full max-w-[38rem] rounded-lg sm:rounded-s-lg shadow-default mb-2 sm:mb-0'>
+      <form
+        onSubmit={onSubmit}
+        className='w-full max-w-[38rem] rounded-lg sm:rounded-s-lg shadow-default mb-2 sm:mb-0'
+      >
         <div className='flex relative'>
           <div className='relative w-full'>
             <input
@@ -17,7 +26,6 @@ function SearchInput(props: SearchInputProps) {
               className='block w-full h-16 z-20 p-4 sm:p-2 sm:pr-16 rounded-lg sm:rounded-s-lg bg-background-color text-primary font-normal text-base placeholder-primary60 border-transparent focus:ring focus:ring-primary60 focus:border-primary60'
               placeholder='Buscar categoria'
               onChange={onChange}
-              required
             />
 
             <button
@@ -34,11 +42,7 @@ function SearchInput(props: SearchInputProps) {
       </form>
 
       <div className='relative flex flex-col sm:hidden w-full gap-2'>
-        <GenericButton
-          title='Buscar produto ou categoria'
-          onClick={onSearch}
-          isHugWidth
-        />
+        <GenericButton title='Buscar categoria' onClick={onSearch} isHugWidth />
       </div>
     </>
   );