docs(gettingstart Page): update doc

digoarthur · digoarthur · commit 86317684b328 · 2023-08-26T10:51:26.000+01:00
diff --git a/github-automated-repos-page/new/index.html b/github-automated-repos-page/new/index.html
@@ -8,6 +8,6 @@
   </head>
   <body>
     <div id="root"></div>
-    <script type="module" src="/src/main.jsx"></script>
+    <script type="module" src="/main.jsx"></script>
   </body>
 </html>
diff --git a/github-automated-repos-page/new/src/components/Loader/index.jsx b/github-automated-repos-page/new/src/components/Loader/index.jsx
diff --git a/github-automated-repos-page/new/src/pages/GettingStart.jsx b/github-automated-repos-page/new/src/pages/GettingStart.jsx
@@ -176,7 +176,7 @@ export default function GettingStart() {
             <div className="flex gap-4 items-center mb-8">
               <button onClick={() => setChangeCodeExample('javascript')} className="bg-[#f3da35a8] w-36 h-12 border-solid border-2 border-white rounded-lg flex justify-center items-center gap-2">Javascript  <img className="" src={javascript_logo} alt='logoLib' /></button>
               <button onClick={() => setChangeCodeExample('typescript')} className="bg-[#3179c64b] w-36 h-12 border-solid border-2 border-white rounded-lg flex justify-center items-center gap-2">Typescript <img className="" src={typescript_logo} alt='logoLib' /></button>
-              <h3 className="text-2xl">App.{changeCodeExample === 'javascript' ? 'js' : 'tsx'}</h3>
+              <h3 className="text-2xl">App.{changeCodeExample === 'javascript' ? 'jsx' : 'tsx'}</h3>
             </div>
 
             {changeCodeExample === 'javascript' ? (
diff --git a/github-automated-repos-page/new/src/pages/ProjectIcons.jsx b/github-automated-repos-page/new/src/pages/ProjectIcons.jsx
@@ -13,12 +13,19 @@ export default function IconsProject() {
 
     useEffect(() => {
         window.scrollTo(0, 0);
+        const id = setTimeout(() => {
+            setFinishedTimeout(true);
+        }, 1000);
+
+        return () => clearTimeout(id);
 
 
     }, []);
 
     const { iconsProjects } = IconsData();
 
+    const [finishedTimeout, setFinishedTimeout] = useState(false);
+
     const [stackIconKeys, setStackIconKeys] = useState([]);
     const [stackIconValues, setStackIconValues] = useState([]);
 
@@ -69,23 +76,30 @@ export default function IconsProject() {
                         <input className=' bg-[#70708e33] w-full rounded-lg px-4 py-2 ' placeholder='🔍 Search Icons' type='text' onChange={_handleSearch} />
                     </div>
                     <ul className='mt-8 flex flex-wrap gap-4 justify-center'>
-                        {stackIconValues.length > 0 ? (
-                         
-                                stackIconValues.map( (item, index) => {
-                                    return <Card key={index} item={item} iconKey={stackIconKeys[index]} />;
-                                })
-                        
-                        ) : (
-                            <div className='flex flex-col m-auto gap-4'>
-                                <p className='text-xl text-center'>
-                                    Didn't find your icon? <br /> Tell us about here:{' '}
-                                    <a className='flex gap-2 text-[#00979C] justify-center' href='https://github.com/DIGOARTHUR/github-automated-repos/issues/new?assignees=&labels=&template=2-feature-request.yaml'>
-                                        Feature Request <FiExternalLink />
-                                    </a>
-                                </p>
-                                <img className='h-[350px]' src='https://user-images.githubusercontent.com/59892368/220364871-f553109d-855f-426a-bbe5-5e1c11278003.svg'></img>
-                            </div>
-                        )}
+                        {
+                            finishedTimeout == false ? (<div>carregando</div>) : (
+                                stackIconValues.length > 0 ? (
+
+                                    stackIconValues.map((item, index) => {
+                                        return <Card key={index} item={item} iconKey={stackIconKeys[index]} />;
+                                    })
+
+
+                                ) : (
+                                    <div className='flex flex-col m-auto gap-4'>
+                                        <p className='text-xl text-center'>
+                                            Didn't find your icon? <br /> Tell us about here:{' '}
+                                            <a className='flex gap-2 text-[#00979C] justify-center' href='https://github.com/DIGOARTHUR/github-automated-repos/issues/new?assignees=&labels=&template=2-feature-request.yaml'>
+                                                Feature Request <FiExternalLink />
+                                            </a>
+                                        </p>
+                                        <img className='h-[350px]' src='https://user-images.githubusercontent.com/59892368/220364871-f553109d-855f-426a-bbe5-5e1c11278003.svg'></img>
+                                    </div>
+                                )
+                            )
+                        }
+
+
 
 
                     </ul>
