feat: upgrade to nuxt3

.github/workflows/ci.yml

@@ -6,16 +6,16 @@ jobs:
   test:
     runs-on: ubuntu-latest
     steps:
-    - name: Checkout repo
-      uses: actions/checkout@v4
+      - name: Checkout repo
+        uses: actions/checkout@v4
 
-    - name: Set up Python 3.12
-      uses: actions/setup-python@v5
-      with:
-        python-version: '3.12'
+      - name: Set up Python 3.12
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.12'
 
-    - name: Install dependencies
-      run: make pre-build
+      - name: Install dependencies
+        run: make pre-build
 
-    - name: Run tests for data sanity
-      run: make test
+      - name: Run tests for data sanity
+        run: make test

.github/workflows/cron.yml

@@ -12,4 +12,3 @@ jobs:
         uses: joelwmale/webhook-action@master
         with:
           url: ${{ secrets.DEPLOY_HOOK_URL }}
-

.gitignore

@@ -1,162 +1,31 @@
-# Public dir
-public/
-resources/
-
-# Node modules
-node_modules/
-themes/lucy/node_modules/
-
-# Generated configs
-cdn_config.toml
-
-# Generated data files
-data/generated.json
-data/tags.json
-content/language/*.md
-
-# Byte-compiled / optimized / DLL files
-__pycache__/
-*.py[cod]
-*$py.class
-
-# C extensions
-*.so
-
-# Distribution / packaging
-.Python
-build/
-develop-eggs/
-dist/
-downloads/
-eggs/
-.eggs/
-lib/
-lib64/
-parts/
-sdist/
-var/
-wheels/
-pip-wheel-metadata/
-share/python-wheels/
-*.egg-info/
-.installed.cfg
-*.egg
-MANIFEST
-
-# PyInstaller
-#  Usually these files are written by a python script from a template
-#  before PyInstaller builds the exe, so as to inject date/other infos into it.
-*.manifest
-*.spec
-
-# Installer logs
-pip-log.txt
-pip-delete-this-directory.txt
-
-# Unit test / coverage reports
-htmlcov/
-.tox/
-.nox/
-.coverage
-.coverage.*
+# Nuxt dev/build outputs
+.output
+.data
+.nuxt
+.nitro
 .cache
-nosetests.xml
-coverage.xml
-*.cover
-*.py,cover
-.hypothesis/
-.pytest_cache/
-cover/
+dist
 
-# Translations
-*.mo
-*.pot
+# Node dependencies
+node_modules
 
-# Django stuff:
+# Logs
+logs
 *.log
-local_settings.py
-db.sqlite3
-db.sqlite3-journal
-
-# Flask stuff:
-instance/
-.webassets-cache
-
-# Scrapy stuff:
-.scrapy
-
-# Sphinx documentation
-docs/_build/
-
-# PyBuilder
-.pybuilder/
-target/
-
-# Jupyter Notebook
-.ipynb_checkpoints
 
-# IPython
-profile_default/
-ipython_config.py
+# Misc
+.DS_Store
+.fleet
+.idea
 
-# pyenv
-#   For a library or package, you might want to ignore these files since the code is
-#   intended to run in multiple environments; otherwise, check them in:
-# .python-version
-
-# pipenv
-#   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
-#   However, in case of collaboration, if having platform-specific dependencies or dependencies
-#   having no cross-platform support, pipenv may install dependencies that don't work, or not
-#   install all needed dependencies.
-#Pipfile.lock
-
-# PEP 582; used by e.g. github.com/David-OConnor/pyflow
-__pypackages__/
-
-# Celery stuff
-celerybeat-schedule
-celerybeat.pid
-
-# SageMath parsed files
-*.sage.py
-
-# Environments
+# Local env files
 .env
-.venv
-env/
-venv/
-ENV/
-env.bak/
-venv.bak/
-
-# Spyder project settings
-.spyderproject
-.spyproject
-
-# Rope project settings
-.ropeproject
-
-# mkdocs documentation
-/site
-
-# mypy
-.mypy_cache/
-.dmypy.json
-dmypy.json
+.env.*
+!.env.example
 
-# Pyre type checker
-.pyre/
+__pycache__
 
-# pytype static type analyzer
-.pytype/
-
-# Cython debug symbols
-cython_debug/
-
-# static files generated from Django application using `collectstatic`
-media
-
-.nuxt
-
-static/sw.js
+# Generated data files
+data/generated.json
+data/tags.json
+content/language/*.md

.nvmrc

@@ -0,0 +1 @@
+node 20.10.0

.prettierignore

@@ -0,0 +1,5 @@
+.nuxt
+pnpm-lock.yaml
+dist
+.output
+*.json

.prettierrc

@@ -0,0 +1,8 @@
+{
+  "printWidth": 120,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "trailingComma": "none",
+  "bracketSpacing": true,
+  "semi": false
+}

Makefile

@@ -2,10 +2,10 @@
 pre-build:
 	pip install --upgrade poetry && \
 	poetry install --no-root && \
-	yarn
+	bun install
 
 build:
-	yarn generate
+	bun generate
 
 generate:
 	poetry run python gfi/populate.py
@@ -21,5 +21,6 @@ test:
 
 format:
 	poetry run ruff format .
+	bunx prettier --write .
 
 .DEFAULT_GOAL := build

README.md

@@ -1,6 +1,6 @@
 <p align="center">
   <a href="https://goodfirstissue.dev" target="_blank">
-    <img src="static/readme-logo.svg">
+    <img src="public/readme-logo.svg">
   </a>
 </p>
 <hr>
@@ -49,8 +49,8 @@ $ cp data/tags.sample.json data/tags.json
 3. Build the front-end app and start the development server.
 
 ```bash
-$ yarn # install the dependencies
-$ yarn dev -o # start the development server
+$ bun install # install the dependencies
+$ bun dev # start the development server
 ```
 
 The app should open in your browser.

components/Banner.vue

@@ -11,19 +11,15 @@
   </header>
 </template>
 
-<script>
+<script setup>
+import { ref, onMounted } from 'vue'
+
 const BANNER_ACTIVE_TIME = 2000
+const bannerActive = ref(true)
 
-export default {
-  data() {
-    return {
-      bannerActive: true
-    }
-  },
-  mounted() {
-    setTimeout(() => {
-      this.bannerActive = false
-    }, BANNER_ACTIVE_TIME)
-  }
-}
+onMounted(() => {
+  setTimeout(() => {
+    bannerActive.value = false
+  }, BANNER_ACTIVE_TIME)
+})
 </script>

components/Navbar.vue

@@ -1,9 +1,9 @@
 <template>
   <header class="w-full py-4 border-b border-ink-200 bg-ink-400">
     <nav class="flex items-center justify-center flex-wrap">
-      <nuxt-link to="/" class="flex items-center text-gray-700 font-bold">
+      <NuxtLink to="/" class="flex items-center text-gray-700 font-bold">
         <img src="~/assets/gfi-logo-white.svg" alt="Good First Issue" class="h-12" />
-      </nuxt-link>
+      </NuxtLink>
       <span v-if="activeTag" class="text-2xl cursor-pointer">
         <span class="font-normal ml-2 mr-1 text-slate">/</span>
         <span class="font-semibold text-juniper">{{ activeTag.language }}</span>
@@ -12,21 +12,12 @@
   </header>
 </template>
 
-<script>
-import { find } from 'lodash'
+<script setup>
 import Tags from '~/data/tags.json'
 
-export default {
-  props: {
-    tag: {
-      type: Object,
-      required: true
-    }
-  },
-  computed: {
-    activeTag: function () {
-      return find(Tags, { slug: this.$route.params.slug })
-    }
-  }
-}
+const route = useRoute()
+
+const activeTag = computed(() => {
+  return Tags.find(tag => tag.slug === route.params.slug)
+})
 </script>