starting to add charts

lucasheartcliff · Sep 26, 2023 · 8ec7579 · 8ec7579
1 parent 1246020
commit 8ec7579
Show file tree

Hide file tree

Showing 9 changed files with 221 additions and 200 deletions.
diff --git a/.nvmrc b/.nvmrc
@@ -0,0 +1 @@
+16
diff --git a/package.json b/package.json
@@ -17,11 +17,6 @@
     "cypress:headless": "cypress run",
     "e2e": "start-server-and-test dev http://localhost:3000 cypress",
     "e2e:headless": "start-server-and-test dev http://localhost:3000 cypress:headless",
-    "storybook": "storybook dev -p 6006",
-    "storybook:build": "storybook build",
-    "storybook:serve": "http-server storybook-static --port 6006 --silent",
-    "serve-storybook": "run-s storybook:*",
-    "test-storybook:ci": "start-server-and-test serve-storybook http://localhost:6006 test-storybook",
     "prepare": "husky install",
     "postbuild": "next-sitemap"
   },
@@ -96,7 +91,6 @@
     "rimraf": "^4.4.1",
     "semantic-release": "^19.0.5",
     "start-server-and-test": "^2.0.0",
-    "storybook": "^7.0.2",
     "tailwindcss": "^3.3.1",
     "typescript": "^4.9.5"
   },

diff --git a/src/components/ActionMenu/ActionMenu.tsx b/src/components/ActionMenu/ActionMenu.tsx
diff --git a/src/components/BaseEntityModal/BaseEntityModal.tsx b/src/components/BaseEntityModal/BaseEntityModal.tsx
diff --git a/src/components/SelectOptions/DocumentOption.tsx b/src/components/SelectOptions/DocumentOption.tsx
diff --git a/src/components/SelectOptions/styled.ts b/src/components/SelectOptions/styled.ts
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -1,11 +1,23 @@
-import { useRouter } from 'next/router';
+import { useRouter } from "next/router";
 
-import { Meta } from '@/layouts/Meta';
-import { Main } from '@/templates/Main';
+import { Meta } from "@/layouts/Meta";
+import { Main } from "@/templates/Main";
+import LanguageChart from "@/components/LanguageChart";
+import { useEffect, useState } from "react";
+import { WAKATIME_LANGUAGES } from "@/utils/url";
+import { CACHE_TIME,apiFetch, useGetRequest } from "@/services";
 
 const Index = () => {
   const router = useRouter();
+  const [data, setData] = useState([])
 
+  useEffect(()=>{
+    apiFetch(WAKATIME_LANGUAGES).get().then(r=>r.json()).then(d=>{
+      setData(d)
+    }).catch(e=>console.error(e))
+  },[])
+
+
   return (
     <Main
       meta={
@@ -15,6 +27,7 @@ const Index = () => {
         />
       }
     >
+      <LanguageChart data={data} />
       <a href="https://github.com/ixartz/Next-js-Boilerplate">
         <img
           src={`${router.basePath}/assets/images/nextjs-starter-banner.png`}
@@ -27,12 +40,12 @@ const Index = () => {
       <p>
         <span role="img" aria-label="rocket">
           🚀
-        </span>{' '}
+        </span>{" "}
         Next.js Boilerplate is a starter code for your Next js project by
-        putting developer experience first .{' '}
+        putting developer experience first .{" "}
         <span role="img" aria-label="zap">
           ⚡️
-        </span>{' '}
+        </span>{" "}
         Made with Next.js, TypeScript, ESLint, Prettier, Husky, Lint-Staged,
         VSCode, Netlify, PostCSS, Tailwind CSS.
       </p>
@@ -42,80 +55,80 @@ const Index = () => {
         <li>
           <span role="img" aria-label="fire">
             🔥
-          </span>{' '}
+          </span>{" "}
           <a href="https://nextjs.org" rel="nofollow">
             Next.js
-          </a>{' '}
+          </a>{" "}
           for Static Site Generator
         </li>
         <li>
           <span role="img" aria-label="art">
             🎨
-          </span>{' '}
-          Integrate with{' '}
+          </span>{" "}
+          Integrate with{" "}
           <a href="https://tailwindcss.com" rel="nofollow">
             Tailwind CSS
           </a>
         </li>
         <li>
           <span role="img" aria-label="nail_care">
             💅
-          </span>{' '}
+          </span>{" "}
           PostCSS for processing Tailwind CSS
         </li>
         <li>
           <span role="img" aria-label="tada">
             🎉
-          </span>{' '}
+          </span>{" "}
           Type checking Typescript
         </li>
         <li>
           <span role="img" aria-label="pencil2">
             ✏️
-          </span>{' '}
-          Linter with{' '}
+          </span>{" "}
+          Linter with{" "}
           <a href="https://eslint.org" rel="nofollow">
             ESLint
           </a>
         </li>
         <li>
           <span role="img" aria-label="hammer_and_wrench">
             🛠
-          </span>{' '}
-          Code Formatter with{' '}
+          </span>{" "}
+          Code Formatter with{" "}
           <a href="https://prettier.io" rel="nofollow">
             Prettier
           </a>
         </li>
         <li>
           <span role="img" aria-label="fox_face">
             🦊
-          </span>{' '}
+          </span>{" "}
           Husky for Git Hooks
         </li>
         <li>
           <span role="img" aria-label="no_entry_sign">
             🚫
-          </span>{' '}
+          </span>{" "}
           Lint-staged for running linters on Git staged files
         </li>
         <li>
           <span role="img" aria-label="no_entry_sign">
             🗂
-          </span>{' '}
+          </span>{" "}
           VSCode configuration: Debug, Settings, Tasks and extension for
           PostCSS, ESLint, Prettier, TypeScript
         </li>
         <li>
           <span role="img" aria-label="robot">
             🤖
-          </span>{' '}
+          </span>{" "}
           SEO metadata, JSON-LD and Open Graph tags with Next SEO
         </li>
         <li>
           <span role="img" aria-label="robot">
             ⚙️
-          </span>{' '}
+          </span>{" "}
           <a
             href="https://www.npmjs.com/package/@next/bundle-analyzer"
             rel="nofollow"
@@ -126,13 +139,13 @@ const Index = () => {
         <li>
           <span role="img" aria-label="rainbow">
             🌈
-          </span>{' '}
+          </span>{" "}
           Include a FREE minimalist theme
         </li>
         <li>
           <span role="img" aria-label="hundred">
             💯
-          </span>{' '}
+          </span>{" "}
           Maximize lighthouse score
         </li>
       </ul>
@@ -141,19 +154,19 @@ const Index = () => {
         <li>
           <span role="img" aria-label="coffee">
             ☕
-          </span>{' '}
+          </span>{" "}
           Minify HTML &amp; CSS
         </li>
         <li>
           <span role="img" aria-label="dash">
             💨
-          </span>{' '}
+          </span>{" "}
           Live reload
         </li>
         <li>
           <span role="img" aria-label="white_check_mark">
             ✅
-          </span>{' '}
+          </span>{" "}
           Cache busting
         </li>
       </ul>
@@ -164,19 +177,19 @@ const Index = () => {
         <li>
           <span role="img" aria-label="rocket">
             🚀
-          </span>{' '}
+          </span>{" "}
           Production-ready
         </li>
       </ul>
       <p>
-        Check our GitHub project for more information about{' '}
+        Check our GitHub project for more information about{" "}
         <a href="https://github.com/ixartz/Next-js-Boilerplate">
           Nextjs Boilerplate
         </a>
-        . You can also browse our{' '}
+        . You can also browse our{" "}
         <a href="https://creativedesignsguru.com/category/nextjs/">
           Premium NextJS Templates
-        </a>{' '}
+        </a>{" "}
         on our website to support this project.
       </p>
     </Main>

diff --git a/src/services/index.ts b/src/services/index.ts
@@ -12,7 +12,7 @@ const jsonHeaders: RequestInit = {
   },
 };
 
-const apiFetch = (url: string) => {
+export const apiFetch = (url: string) => {
   const headers = jsonHeaders;
 
   return {