Merge pull request #68 from falsepopsky/dev

chore: update db, project

.devcontainer/devcontainer.json

@@ -1,22 +1,23 @@
 {
-	"name": "Ubuntu",
-	"image": "mcr.microsoft.com/devcontainers/base:jammy",
-	"features": {
-		"ghcr.io/devcontainers/features/node:1": {
-			"nodeGypDependencies": true,
-			"version": "18",
-			"nvmVersion": "latest"
-		}
-	},
-	"customizations": {
-		"vscode": {
-			"extensions": [
-				"EditorConfig.EditorConfig",
-				"bradlc.vscode-tailwindcss",
-				"esbenp.prettier-vscode",
-				"dbaeumer.vscode-eslint",
-				"github.vscode-github-actions"
-			]
-		}
-	}
+  "name": "vagabond container",
+  "image": "mcr.microsoft.com/devcontainers/base:jammy",
+  "features": {
+    "ghcr.io/devcontainers/features/node:1": {
+      "nodeGypDependencies": true,
+      "version": "20.10.0",
+      "nvmVersion": "latest"
+    }
+  },
+  "customizations": {
+    "vscode": {
+      "extensions": [
+        "editorconfig.editorconfig",
+        "bradlc.vscode-tailwindcss",
+        "esbenp.prettier-vscode",
+        "dbaeumer.vscode-eslint",
+        "github.vscode-github-actions"
+      ]
+    }
+  },
+  "postCreateCommand": "corepack enable && pnpm install"
 }

.github/labeler.yaml

@@ -0,0 +1,11 @@
+"new morning issue":
+  - "apps/moon/src/components/**/db.js"
+  - "apps/sun/app/components/Chapterpy.tsx"
+  - "apps/sun/app/components/Heatmap.tsx"
+documentation:
+  - "docs/**"
+  - "README.md"
+enhancement:
+  - "apps/sun/app/components/**"
+styles:
+  - "apps/sun/app/globals.css"

.github/workflows/label.yml → .github/workflows/label.yaml

@@ -12,3 +12,4 @@ jobs:
       - uses: actions/[email protected]
         with:
           repo-token: ${{ secrets.GITHUB_TOKEN }}
+          configuration-path: .github/labeler.yaml

.gitignore

@@ -2,8 +2,8 @@
 **/node_modules
 
 # production
-*/build
-*/out
-*/.next
+build
+out
+.next
 
-next-env.d.ts
+next-env.d.ts

moon/.prettierignore → .prettierignore

@@ -1,2 +1,5 @@
+.next
+public
 build
+dist
 pnpm-lock.yaml

.prettierrc

@@ -0,0 +1,13 @@
+{
+  "bracketSameLine": true,
+  "embeddedLanguageFormatting": "auto",
+  "htmlWhitespaceSensitivity": "css",
+  "singleQuote": true,
+  "jsxSingleQuote": true,
+  "printWidth": 120,
+  "proseWrap": "preserve",
+  "trailingComma": "es5",
+  "tabWidth": 2,
+  "plugins": ["prettier-plugin-tailwindcss"],
+  "overrides": [{ "files": "*.yaml", "options": { "singleQuote": false, "printWidth": 100, "proseWrap": "never" } }]
+}

.vercelignore

@@ -1,4 +1,4 @@
+.devcontainer
 .vscode
-docs
-moon
 .github
+docs

.vscode/settings.json

@@ -2,8 +2,8 @@
   "editor.defaultFormatter": "esbenp.prettier-vscode",
   "editor.formatOnSave": true,
   "editor.codeActionsOnSave": {
-    "source.fixAll": true,
-    "source.organizeImports": true
+    "source.fixAll": "always",
+    "source.organizeImports": "always"
   },
   "editor.wordWrap": "on",
   "editor.guides.bracketPairs": "active",
@@ -18,6 +18,5 @@
   "files.associations": {
     "*.css": "tailwindcss"
   },
-  "eslint.validate": ["typescript", "typescriptreact"],
-  "eslint.workingDirectories": ["./sun"]
+  "eslint.workingDirectories": ["./apps/sun"]
 }

README.md

@@ -14,10 +14,10 @@ A simple way to visualize the actual state of Vagabond by Inoue Takehiko with ch
 
 ## :open_file_folder: Structure
 
-| Codebase     | Description      | Status                    | Docs                     |
-| :----------- | :--------------- | :------------------------ | :----------------------- |
-| [moon](moon) | Create React App | :x: deprecated            | [Readme](./docs/MOON.md) |
-| [sun](sun)   | Next.js          | :white_check_mark: active | [Readme](./docs/SUN.md)  |
+| Codebase          | Description      | Status                    | Docs                     |
+| :---------------- | :--------------- | :------------------------ | :----------------------- |
+| [moon](apps/moon) | Create React App | :x: deprecated            | [Readme](./docs/MOON.md) |
+| [sun](apps/sun)   | Next.js          | :white_check_mark: active | [Readme](./docs/SUN.md)  |
 
 ## :clap: Special Thanks
 
@@ -31,4 +31,4 @@ A simple way to visualize the actual state of Vagabond by Inoue Takehiko with ch
 
 ## :scroll: Changelog
 
-[Last update: 22/08/23](./docs/CHANGELOG.md)
+[Last update: 26/12/23](./docs/CHANGELOG.md)

moon/package.json → apps/moon/package.json

@@ -22,8 +22,7 @@
     "predeploy": "npm run build",
     "deploy": "gh-pages -d build",
     "start": "react-scripts start",
-    "build": "react-scripts build",
-    "format": "prettier --cache -w ."
+    "build": "react-scripts build"
   },
   "eslintConfig": {
     "extends": [
@@ -43,7 +42,6 @@
     ]
   },
   "devDependencies": {
-    "gh-pages": "^4.0.0",
-    "prettier": "^2.7.1"
+    "gh-pages": "^4.0.0"
   }
 }

moon/src/components/footer/Footer.jsx → apps/moon/src/components/footer/Footer.jsx

@@ -10,9 +10,7 @@ const Footer = () => {
         <FooterTitle>GENERAL</FooterTitle>
         <TextFooter>The website of Vagabond Hiatus Chart.</TextFooter>
         <TextFooter>Some of the images belongs to Takehiko Inoue &amp; Kōdansha.</TextFooter>
-        <TextFooter>
-          For a better experience use firefox and visit the site on desktop mode.
-        </TextFooter>
+        <TextFooter>For a better experience use firefox and visit the site on desktop mode.</TextFooter>
       </FooterSection>
 
       <FooterSection className='section-two'>
@@ -27,12 +25,7 @@ const Footer = () => {
 
       <FooterSection className='section-three'>
         <FooterTitle>EXTRA LINKS</FooterTitle>
-        <StyledLink
-          href='https://itplanning.co.jp/'
-          rel='noopener noreferrer'
-          target='_blank'
-          footerMar
-          footerLink>
+        <StyledLink href='https://itplanning.co.jp/' rel='noopener noreferrer' target='_blank' footerMar footerLink>
           Takehiko Inoue
         </StyledLink>
         <StyledLink

moon/src/components/heatmap/hiatusHeatmapConfig.js → apps/moon/src/components/heatmap/hiatusHeatmapConfig.js

@@ -74,13 +74,7 @@ export const configHeatmap = {
     legendOffset: 0,
   },
   margin: { top: 20, right: 0, bottom: 60, left: 40 },
-  colorsPublications: [
-    'hsl(0, 2%, 100%, 0)',
-    '#f4f7f3',
-    '#70DDC6',
-    '#F95D5A',
-    'hsl(0, 0%, 100%, 0)',
-  ],
+  colorsPublications: ['hsl(0, 2%, 100%, 0)', '#f4f7f3', '#70DDC6', '#F95D5A', 'hsl(0, 0%, 100%, 0)'],
   colorsArcs: [
     'hsl(0, 2%, 100%, 0)',
     '#f4f7f3',

moon/src/components/hero/Hero.jsx → apps/moon/src/components/hero/Hero.jsx

@@ -18,9 +18,7 @@ const HeroSection = () => {
               <HeroP>HIATUS</HeroP>
               <HeroP>CHART</HeroP>
             </StyledH1>
-            <HeroP story={'second'}>
-              A simple way to visualize the actual state of Vagabond with charts.
-            </HeroP>
+            <HeroP story={'second'}>A simple way to visualize the actual state of Vagabond with charts.</HeroP>
           </MiniBox>
           <MiniBox blob>
             <div className='box redbox'>

moon/src/components/svg/Svgs.jsx → apps/moon/src/components/svg/Svgs.jsx

@@ -680,26 +680,8 @@ const Legend = () => (
         d='M269.1,49.4h-25.7c-1.7,0-3.1-1.4-3.1-3.1V20.5c0-1.7,1.4-3.1,3.1-3.1h25.7c1.7,0,3.1,1.4,3.1,3.1v25.7 C272.3,48,270.9,49.4,269.1,49.4z'
       />
     </g>
-    <line
-      fill='none'
-      stroke='#22577A'
-      strokeWidth='4'
-      strokeMiterlimit='10'
-      x1='26.3'
-      y1='10.8'
-      x2='26.3'
-      y2='124.8'
-    />
-    <line
-      fill='none'
-      stroke='#22577A'
-      strokeWidth='4'
-      strokeMiterlimit='10'
-      x1='25.3'
-      y1='124'
-      x2='145.8'
-      y2='124'
-    />
+    <line fill='none' stroke='#22577A' strokeWidth='4' strokeMiterlimit='10' x1='26.3' y1='10.8' x2='26.3' y2='124.8' />
+    <line fill='none' stroke='#22577A' strokeWidth='4' strokeMiterlimit='10' x1='25.3' y1='124' x2='145.8' y2='124' />
     <g>
       <path
         fill='#C7F9CC'
@@ -760,15 +742,9 @@ const Legend = () => (
 		c1.2,0,2.1,0.4,2.9,1.2c0.7,0.8,1.1,2,1.4,3.3V107.8z M323.7,106.8h4.5c0-0.7-0.3-1.3-0.6-1.6c-0.4-0.4-0.9-0.6-1.5-0.6
 		s-1.2,0.2-1.6,0.6C324.1,105.5,323.8,106.1,323.7,106.8z'
       />
-      <path
-        fill='#C7F9CC'
-        d='M331.3,98.8h2v14h-2V98.8z M337.7,102.8h2.1l-3.8,4.4l4.6,4.6h-2.4l-4.5-4.6L337.7,102.8z'
-      />
+      <path fill='#C7F9CC' d='M331.3,98.8h2v14h-2V98.8z M337.7,102.8h2.1l-3.8,4.4l4.6,4.6h-2.4l-4.5-4.6L337.7,102.8z' />
       <path fill='#C7F9CC' d='M341.3,98.8h2v14h-2V98.8z' />
-      <path
-        fill='#C7F9CC'
-        d='M351.3,102.8h2.1l-6.6,14h-2l3.1-6.7l-3.6-7.3h2.1l2.5,5.2L351.3,102.8z'
-      />
+      <path fill='#C7F9CC' d='M351.3,102.8h2.1l-6.6,14h-2l3.1-6.7l-3.6-7.3h2.1l2.5,5.2L351.3,102.8z' />
       <path fill='#C7F9CC' d='M360.3,98.8h2v14h-2V98.8z' />
       <path
         fill='#C7F9CC'
@@ -813,16 +789,11 @@ const RedBlob = () => (
         <stop offset='100%' stopColor='#eb253c' />
       </radialGradient>
       <clipPath id='shape'>
-        <path
-          fill='currentColor'
-          d='M600,706Q262,912,261,498Q260,84,599,292Q938,500,600,706Z'></path>
+        <path fill='currentColor' d='M600,706Q262,912,261,498Q260,84,599,292Q938,500,600,706Z'></path>
       </clipPath>
     </defs>
     <g clipPath='url(#shape)'>
-      <path
-        fill='url(#redGradientId)'
-        d='M600,706Q262,912,261,498Q260,84,599,292Q938,500,600,706Z'
-      />
+      <path fill='url(#redGradientId)' d='M600,706Q262,912,261,498Q260,84,599,292Q938,500,600,706Z' />
     </g>
   </svg>
 );
@@ -857,16 +828,11 @@ const WhiteBlob = () => (
         <stop offset='100%' stopColor='#858e9b' />
       </linearGradient>
       <clipPath id='whiteShape'>
-        <path
-          fill='currentColor'
-          d='M612,697.5Q272,895,285,522.5Q298,150,625,325Q952,500,612,697.5Z'></path>
+        <path fill='currentColor' d='M612,697.5Q272,895,285,522.5Q298,150,625,325Q952,500,612,697.5Z'></path>
       </clipPath>
     </defs>
     <g clipPath='url(#whiteShape)'>
-      <path
-        fill='url(#whiteGradientId)'
-        d='M612,697.5Q272,895,285,522.5Q298,150,625,325Q952,500,612,697.5Z'
-      />
+      <path fill='url(#whiteGradientId)' d='M612,697.5Q272,895,285,522.5Q298,150,625,325Q952,500,612,697.5Z' />
     </g>
   </svg>
 );

moon/src/pages/About.jsx → apps/moon/src/pages/About.jsx

@@ -9,8 +9,7 @@ import {
   TitleAbout,
 } from './../components/styled/globalUI';
 
-const DataDrive =
-  'https://docs.google.com/spreadsheets/d/1fw7G9I2zPtAfSh0NUl-4m7G5wsXe5PIcMFRtd03jVz0/';
+const DataDrive = 'https://docs.google.com/spreadsheets/d/1fw7G9I2zPtAfSh0NUl-4m7G5wsXe5PIcMFRtd03jVz0/';
 const HiatusGH = 'https://hiatus-hiatus.github.io/';
 const Form = 'https://forms.gle/QjtffknkRddEy4TaA';
 
@@ -25,13 +24,12 @@ const About = () => {
           <TitleAbout>ABOUT</TitleAbout>
 
           <StyledText>
-            As a kid I always liked Slam Dunk, then some of my friends told me about this manga. I
-            could not believe it that the mangaka of this masterpiece it's the same who made SD!
+            As a kid I always liked Slam Dunk, then some of my friends told me about this manga. I could not believe it
+            that the mangaka of this masterpiece it's the same who made SD!
           </StyledText>
           <StyledText>
-            So this is my little contribution, i'm planning to build the same project with more
-            titles, when the project it's ready i will make an announcement in the home site, so
-            stay stuned, and hope you guys like it !
+            So this is my little contribution, i'm planning to build the same project with more titles, when the project
+            it's ready i will make an announcement in the home site, so stay stuned, and hope you guys like it !
           </StyledText>
         </SectionContainer>
         <SectionContainer pad={'20px 3vw'}>
@@ -56,9 +54,8 @@ const About = () => {
         <SectionContainer pad={'20px 3vw'}>
           <TitleAbout>CONTACT</TitleAbout>
           <StyledText>
-            For business inquires only at <b className='reverse'>moc.liamnotorp@ykspopeslaf</b> with
-            the subject <b className='reverse'>ved ssenisub</b>, any other message without the
-            subject will be deleted.
+            For business inquires only at <b className='reverse'>moc.liamnotorp@ykspopeslaf</b> with the subject{' '}
+            <b className='reverse'>ved ssenisub</b>, any other message without the subject will be deleted.
           </StyledText>
 
           <StyledText>

sun/app/components/Chapterpy.tsx → apps/sun/app/components/Chapterpy.tsx

@@ -13,7 +13,7 @@ const AreaDB: ApexOptions = {
     },
     {
       name: 'Hiatus chapters',
-      data: [0, 8, 13, 14, 22, 29, 37, 30, 25, 26, 31, 21, 35, 48, 40, 37, 42, 47, 48, 49, 48, 48, 48, 48, 48, 41],
+      data: [0, 8, 13, 14, 22, 29, 37, 30, 25, 26, 31, 21, 35, 48, 40, 37, 42, 47, 48, 49, 48, 48, 48, 48, 48, 49],
     },
   ],
   dataLabels: {