Add firebase deployment to release action (#38)

* Add firebase deployment to release action * Add firebase files * Add firebase files * Try new release action * Try new release action * Separate build step * Use icons for buttons and fix image for initial dark mode * Test new deploy * Test new deploy * Test new deploy * Test new deploy * Test new deploy * Test new deploy * Test new deploy * Test new deploy * Test new deploy * Test new deploy * Test new deploy * Test new deploy * Some cleanup * Some cleanup * Some cleanup
harm-matthias-harms · Oct 26, 2023 · 0897afb · 0897afb
1 parent 5758acc
commit 0897afb
Show file tree

Hide file tree

Showing 8 changed files with 2,554 additions and 122 deletions.
diff --git a/.firebaserc b/.firebaserc
@@ -0,0 +1,5 @@
+{
+  "projects": {
+    "default": "hmh-sideprojects"
+  }
+}
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -1,9 +1,6 @@
 name: Release
 
 on:
-  push:
-    branches:
-      - main
   release:
     types:
       - published
@@ -19,6 +16,30 @@ jobs:
     uses: ./.github/workflows/test.yml
   release:
     runs-on: ubuntu-latest
-    needs: [lint, test]
+    needs:
+      - lint
+      - test
     steps:
-      - run: echo "Releasing..."
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version-file: .tool-version
+          cache: 'npm'
+      - run: npm install -g firebase-tools
+      - run: npm ci
+      - run: npm run build
+        env:
+          NITRO_PRESET: firebase
+      - name: Manipulate build for firebase
+        run: |
+          jq '.main |= "server/index.mjs"' .output/server/package.json > .output/package.json
+          rm -f .output/server/package.json
+          mv .output/server/node_modules .output/.
+      - run: echo $FIREBASE_SERVICE_ACCOUNT_HMH_SIDEPROJECTS > service-account.json
+        env:
+          FIREBASE_SERVICE_ACCOUNT_HMH_SIDEPROJECTS: ${{ secrets.FIREBASE_SERVICE_ACCOUNT_HMH_SIDEPROJECTS }}
+      - run: firebase deploy
+        env:
+          GOOGLE_APPLICATION_CREDENTIALS: service-account.json
+      - if: success() || failure()
+        run: rm service-account.json
diff --git a/components/ColorModeButton.vue b/components/ColorModeButton.vue
@@ -1,11 +1,11 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 const colorMode = useColorMode()
 
 const isDark = computed({
-  get () {
+  get() {
     return colorMode.value === 'dark'
   },
-  set () {
+  set() {
     colorMode.preference = colorMode.value === 'dark' ? 'light' : 'dark'
   }
 })
@@ -15,14 +15,14 @@ const isDark = computed({
   <ClientOnly>
     <UButton
         :icon="isDark ? 'i-heroicons-moon-20-solid' : 'i-heroicons-sun-20-solid'"
+        aria-label="Theme"
         color="gray"
         variant="ghost"
-        aria-label="Theme"
         @click="isDark = !isDark"
     />
 
     <template #fallback>
-      <div class="w-8 h-8" />
+      <div class="w-8 h-8"/>
     </template>
   </ClientOnly>
 </template>
diff --git a/components/Hero.vue b/components/Hero.vue
@@ -16,14 +16,21 @@ const imageSrc = computed(() => {
           Software
         </Paragraph>
         <div class="flex gap-4">
-          <UButton target="_blank" to="https://www.linkedin.com/in/harm-matthias-harms-675682186/">
+          <UButton icon="i-simple-icons-linkedin" target="_blank"
+                   to="https://www.linkedin.com/in/harm-matthias-harms-675682186/">
             LinkedIn
           </UButton>
-          <UButton color="gray" target="_blank" to="https://github.com/harm-matthias-harms">GitHub</UButton>
-          <UButton color="gray" to="mailto:mail@matthiasharms.dev">Email</UButton>
+          <UButton color="gray" icon="i-simple-icons-github" target="_blank"
+                   to="https://github.com/harm-matthias-harms">
+            GitHub
+          </UButton>
+          <UButton color="gray" icon="i-heroicons-envelope-20-solid" to="mailto:mail@matthiasharms.dev">Email
+          </UButton>
         </div>
       </div>
-      <NuxtImg :src="imageSrc" alt="Image of Harm Matthias Harms" class="rounded-lg w-96"/>
+      <ClientOnly>
+        <NuxtImg :src="imageSrc" alt="Image of Harm Matthias Harms" class="rounded-lg w-96"/>
+      </ClientOnly>
     </div>
   </div>
 </template>
diff --git a/firebase.json b/firebase.json
@@ -0,0 +1,18 @@
+{
+  "functions": {
+    "source": ".output"
+  },
+  "hosting": [
+    {
+      "site": "hmh-sideprojects",
+      "public": ".output/public",
+      "cleanUrls": true,
+      "rewrites": [
+        {
+          "source": "**",
+          "function": "server"
+        }
+      ]
+    }
+  ]
+}
diff --git a/nuxt.config.ts b/nuxt.config.ts
@@ -2,6 +2,9 @@
 export default defineNuxtConfig({
     devtools: {enabled: true},
     modules: ['@nuxt/ui', '@nuxtjs/color-mode', "@nuxt/image"],
+    ui: {
+        icons: ['heroicons', 'simple-icons']
+    },
     app: {
         head: {
             title: 'About Harm Matthias Harms',
@@ -15,5 +18,10 @@ export default defineNuxtConfig({
                 lang: 'en'
             }
         }
+    },
+    nitro: {
+        firebase: {
+            gen: 2
+        }
     }
 })