Merge pull request #72 from sungik-choi/chore/deps

v3.2.0

.eslintrc.js

@@ -3,31 +3,34 @@ module.exports = {
   parserOptions: {
     tsconfigRootDir: __dirname,
     project: "./tsconfig.json",
+    ecmaVersion: "latest",
+    sourceType: "module",
   },
-  // NOTE: cf. https://stackoverflow.com/questions/63118405/how-to-fix-eslintrc-the-file-does-not-match-your-project-config
-  ignorePatterns: [".eslintrc.js", "**/build/*", "*.js"],
   overrides: [
     {
       files: ["*.ts", "*.tsx"],
       processor: "@graphql-eslint/graphql",
       parser: "@typescript-eslint/parser",
       plugins: [
+        "unicorn",
         "import",
         "react",
         "react-hooks",
         "jsx-a11y",
         "@typescript-eslint",
       ],
       extends: [
-        "eslint:recommended",
+        "plugin:unicorn/recommended",
         "plugin:@typescript-eslint/recommended",
         "prettier",
       ],
       env: {
-        es6: true,
+        es2024: true,
       },
       rules: {
-        "no-multiple-empty-lines": ["error", { max: 1, maxEOF: 1, maxBOF: 0 }],
+        "unicorn/filename-case": 0,
+        "unicorn/prevent-abbreviations": 0,
+        "unicorn/no-abusive-eslint-disable": 0,
         "import/no-duplicates": ["error", { "prefer-inline": true }],
         "@typescript-eslint/consistent-type-imports": [
           "error",

.github/workflows/codeql-analysis.yml

@@ -38,7 +38,7 @@ jobs:
 
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
 
       # Initializes the CodeQL tools for scanning.
       - name: Initialize CodeQL

.github/workflows/release.yml

@@ -6,19 +6,31 @@ on:
   pull_request:
     branches: [main]
 
-  workflow_dispatch:
-
 jobs:
   build:
     name: Build
     runs-on: ubuntu-latest
 
     steps:
       - name: Checkout
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: .nvmrc
+
+      - name: Install Dependencies
+        run: yarn install --frozen-lockfile
+
+      - name: Build
+        run: yarn build
+
+      - name: Lint
+        run: yarn lint
 
       - name: Release
-        uses: cycjimmy/semantic-release-action@v3
+        uses: cycjimmy/semantic-release-action@v4
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

.lintstagedrc

@@ -1,3 +1,4 @@
 {
-  "**/*.(js|ts)?(x)": ["yarn lint:fix", "yarn format"]
+  "**/*.(js|ts)?(x)": "yarn lint:fix",
+  "**/*": "yarn format"
 }

.nvmrc

@@ -1 +1 @@
-18.16.0
+lts/*

.prettierignore

@@ -1,2 +1,3 @@
 .cache
+.yarn
 public

.releaserc

@@ -2,7 +2,15 @@
   "plugins": [
     "@semantic-release/commit-analyzer",
     "@semantic-release/release-notes-generator",
-    "@semantic-release/github"
+    "@semantic-release/github",
+    [
+      "@semantic-release/npm",
+      {
+        "npmPublish": false
+      }
+    ]
   ],
-  "branches": ["main"]
+  "branches": [
+    "main"
+  ]
 }

.yarnrc.yml

@@ -1,3 +1,7 @@
-yarnPath: .yarn/releases/yarn-3.5.1.cjs
+compressionLevel: mixed
+
+enableGlobalCache: false
 
 nodeLinker: node-modules
+
+yarnPath: .yarn/releases/yarn-4.0.2.cjs

CONTRIBUTING.md

@@ -19,17 +19,18 @@ We actively welcome your pull requests:
 1. Fork the repo and create your branch from `main`.
 2. Make sure your code lints.
 3. (Recommended) Commit with [commitizen(cz-cli)](https://github.com/commitizen/cz-cli).
-    1. Install commitizen globally.
 
-        ```bash
-        yarn dlx commitizen
-        ```
+   1. Install commitizen globally.
 
-    2. Commit with commitizen.
+      ```bash
+      yarn dlx commitizen
+      ```
 
-        ```bash
-        git cz
-        ```
+   2. Commit with commitizen.
+
+      ```bash
+      git cz
+      ```
 
 4. Push to your forked repository.
 5. Issue that pull request (from forked repository to origin).

README.md

@@ -10,7 +10,7 @@ Gatsby blog starter kit with beautiful responsive design
 
 ## 🍎 Demo
 
-👉 **View [Demo Page](https://apple.gatsbyjs.io/)**
+👉 **View [Demo Page](https://gatsby-starter-apple.netlify.app)**
 
 ## ✨ Features
 

gatsby-config.js

@@ -32,6 +32,7 @@ const corePlugins = [
     options: {
       name: "src",
       path: `${__dirname}/src`,
+      ignore: [`**/*.d.ts`],
     },
   },
   {

package.json

@@ -1,96 +1,104 @@
 {
   "name": "gatsby-starter-apple",
-  "version": "3.0.0",
+  "version": "3.1.1",
   "description": "Gatsby blog starter kit with beautiful and responsive design",
-  "main": "index.js",
   "private": true,
   "engines": {
-    "node": ">=18.16.0"
+    "node": ">=20"
   },
   "scripts": {
     "build": "gatsby build",
     "develop": "gatsby develop",
     "start": "gatsby develop",
     "serve": "gatsby serve",
     "clean": "gatsby clean",
-    "lint": "eslint '**/*.{ts,tsx}'",
-    "lint:fix": "npm run lint -- --fix",
-    "format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,md,yml}\"",
+    "lint": "eslint '**/*.{js, jsx, ts, tsx}'",
+    "lint:fix": "yarn lint --fix",
+    "format": "prettier . --write --ignore-unknown",
     "typecheck": "tsc --noEmit",
     "semantic-release": "semantic-release",
     "lint-staged": "lint-staged",
     "pre-commit": "yarn lint-staged && yarn typecheck",
     "postinstall": "husky install"
   },
   "dependencies": {
-    "dark-github-theme": "https://github.com/remorses/dark-github-theme",
-    "gatsby": "^5.10.0",
-    "gatsby-plugin-feed": "^5.10.0",
-    "gatsby-plugin-image": "^3.10.0",
-    "gatsby-plugin-manifest": "^5.10.0",
-    "gatsby-plugin-offline": "^6.10.0",
-    "gatsby-plugin-react-helmet": "^6.10.0",
-    "gatsby-plugin-sharp": "^5.10.0",
-    "gatsby-plugin-sitemap": "^6.10.0",
-    "gatsby-plugin-styled-components": "^6.10.0",
-    "gatsby-plugin-typography": "^5.10.0",
-    "gatsby-remark-copy-linked-files": "^6.10.0",
-    "gatsby-remark-images": "^7.10.0",
+    "dark-github-theme": "https://github.com/remorses/dark-github-theme.git#commit=3dde125a391f5557fcc42e0d95899750df4370bf",
+    "gatsby": "^5.12.12",
+    "gatsby-plugin-feed": "^5.12.3",
+    "gatsby-plugin-image": "^3.12.3",
+    "gatsby-plugin-manifest": "^5.12.3",
+    "gatsby-plugin-offline": "^6.12.3",
+    "gatsby-plugin-react-helmet": "^6.12.0",
+    "gatsby-plugin-sharp": "^5.12.3",
+    "gatsby-plugin-sitemap": "^6.12.3",
+    "gatsby-plugin-styled-components": "^6.12.0",
+    "gatsby-plugin-typography": "^5.12.0",
+    "gatsby-remark-copy-linked-files": "^6.12.0",
+    "gatsby-remark-images": "^7.12.3",
     "gatsby-remark-vscode": "^3.3.1",
-    "gatsby-source-filesystem": "^5.10.0",
-    "gatsby-transformer-remark": "^6.10.0",
-    "gatsby-transformer-sharp": "^5.10.0",
+    "gatsby-source-filesystem": "^5.12.1",
+    "gatsby-transformer-remark": "^6.12.3",
+    "gatsby-transformer-sharp": "^5.12.3",
     "react-helmet": "^6.1.0",
     "react-typography": "^0.16.23",
-    "styled-components": "^5.3.11",
-    "styled-reset": "^4.4.7",
-    "typography": "^0.16.21",
-    "vscode-theme-github-light": "https://github.com/yunlingz/vscode-theme-github-light"
+    "styled-components": "^6.1.1",
+    "styled-reset": "^4.5.1",
+    "typography": "^0.16.24",
+    "vscode-theme-github-light": "https://github.com/yunlingz/vscode-theme-github-light.git#commit=38174065a9e6c8d93a20fab5fe7c7641c07aeca7"
   },
   "devDependencies": {
-    "@commitlint/cli": "^17.6.3",
-    "@commitlint/config-conventional": "^17.6.3",
-    "@graphql-eslint/eslint-plugin": "^3.19.1",
-    "@semantic-release/commit-analyzer": "^9.0.2",
-    "@semantic-release/github": "^8.1.0",
-    "@semantic-release/release-notes-generator": "^11.0.2",
-    "@types/react-helmet": "^6.1.6",
-    "@types/styled-components": "^5.1.26",
-    "@types/typography": "^0.16.4",
-    "@typescript-eslint/eslint-plugin": "^5.59.7",
-    "@typescript-eslint/parser": "^5.59.7",
+    "@commitlint/cli": "^18.4.3",
+    "@commitlint/config-conventional": "^18.4.3",
+    "@graphql-eslint/eslint-plugin": "^3.20.1",
+    "@semantic-release/commit-analyzer": "^11.1.0",
+    "@semantic-release/github": "^9.2.5",
+    "@semantic-release/npm": "^11.0.2",
+    "@semantic-release/release-notes-generator": "^12.1.0",
+    "@types/react-helmet": "^6.1.11",
+    "@types/styled-components": "^5.1.34",
+    "@types/typography": "^0.16.7",
+    "@typescript-eslint/eslint-plugin": "^6.13.2",
+    "@typescript-eslint/parser": "^6.13.2",
+    "babel-plugin-styled-components": "^2.1.4",
     "disable-scroll": "^0.6.0",
-    "eslint": "^8.41.0",
-    "eslint-config-prettier": "^8.8.0",
-    "eslint-plugin-import": "^2.27.5",
-    "eslint-plugin-jsx-a11y": "^6.7.1",
-    "eslint-plugin-react": "^7.32.2",
+    "eslint": "^8.55.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-import": "^2.29.0",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
+    "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-unicorn": "^49.0.0",
     "gatsby-plugin-alias-imports": "^1.0.5",
     "gatsby-plugin-robots-txt": "^1.8.0",
-    "gatsby-plugin-typescript": "^5.10.0",
+    "gatsby-plugin-typescript": "^5.12.1",
     "graphql": "^16.8.1",
     "husky": "^8.0.3",
-    "lint-staged": "^13.2.2",
+    "lint-staged": "^15.2.0",
     "lodash": "^4.17.21",
-    "prettier": "^2.8.8",
+    "prettier": "^3.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "semantic-release": "^21.0.2",
-    "typescript": "^5.0.4"
+    "semantic-release": "^22.0.10",
+    "typescript": "^5.3.3"
   },
   "repository": {
     "type": "git",
     "url": "https://github.com/sungik-choi/gatsby-starter-apple.git"
   },
   "keywords": [
-    "gatsby"
+    "gatsby",
+    "gatsby-starter",
+    "gatsby-starter-blog",
+    "gatsby-blog",
+    "blog",
+    "template",
+    "starter"
   ],
   "author": "Sungik Choi <sungik.dev@gmail.com> (http://sungikchoi.com/)",
   "license": "MIT",
   "bugs": {
     "url": "https://github.com/sungik-choi/gatsby-starter-apple/issues"
   },
   "homepage": "https://github.com/sungik-choi/gatsby-starter-apple#readme",
-  "packageManager": "yarn@3.5.1"
+  "packageManager": "yarn@4.0.2"
 }

src/components/catetgoryFilter/categoryFilter.tsx

@@ -1,7 +1,6 @@
 import React, { useMemo, useRef } from "react"
 
-import { Link } from "gatsby"
-import type { GatsbyLinkProps } from "gatsby"
+import { type GatsbyLinkProps, Link } from "gatsby"
 import kebabCase from "lodash/kebabCase"
 import styled from "styled-components"
 
@@ -10,22 +9,24 @@ import useScrollCenter from "./useScrollCenter"
 const ACTIVE = "active"
 const ALL_CATEGORY_NAME = "All"
 
-interface CategoryFilterProps {
+interface CategoryFilterProperties {
   categoryList: readonly Queries.MarkdownRemarkGroupConnection[]
 }
 
-type LinkPropsGetter = GatsbyLinkProps<unknown>["getProps"]
+type LinkPropertiesGetter = GatsbyLinkProps<unknown>["getProps"]
 
-const CategoryFilter: React.FC<CategoryFilterProps> = ({ categoryList }) => {
-  const categoryRef = useRef<HTMLUListElement>(null)
-  const isActive: LinkPropsGetter = ({ isCurrent }) =>
+const CategoryFilter: React.FC<CategoryFilterProperties> = ({
+  categoryList,
+}) => {
+  const categoryReference = useRef<HTMLUListElement>(null)
+  const isActive: LinkPropertiesGetter = ({ isCurrent }) =>
     isCurrent ? { id: ACTIVE, tabIndex: -1 } : {}
 
-  useScrollCenter({ ref: categoryRef, targetId: ACTIVE })
+  useScrollCenter({ ref: categoryReference, targetId: ACTIVE })
 
   const sortedCategoryList = useMemo(
     () => [...categoryList].sort((a, b) => b.totalCount - a.totalCount),
-    [categoryList]
+    [categoryList],
   )
 
   return (
@@ -35,7 +36,7 @@ const CategoryFilter: React.FC<CategoryFilterProps> = ({ categoryList }) => {
         {ALL_CATEGORY_NAME}
       </CategoryButton>
       <Divider />
-      <CategoryUl ref={categoryRef} className="invisible-scrollbar">
+      <CategoryUl ref={categoryReference} className="invisible-scrollbar">
         {sortedCategoryList.map(category => {
           const { fieldValue } = category
           return (

src/components/catetgoryFilter/index.ts

@@ -1,3 +1 @@
-import CategoryFilter from "./categoryFilter"
-
-export default CategoryFilter
+export { default } from "./categoryFilter"