playground: add firebase page

Author: davidstackio

playground/nuxt.config.ts

@@ -1,4 +1,4 @@
-import { mdiAccountMultiple, mdiViewDashboard, mdiHome, mdiTestTube, mdiLogin, mdiAccountPlus, mdiAccountCog } from '@mdi/js'
+import { mdiAccountMultiple, mdiViewDashboard, mdiHome, mdiFirebase, mdiTestTube, mdiLogin, mdiAccountPlus, mdiAccountCog } from '@mdi/js'
 
 export default defineNuxtConfig({
   modules: ['../src/module'],
@@ -29,6 +29,11 @@ export default defineNuxtConfig({
           to: '/',
           icon: mdiHome,
         },
+        {
+          text: 'Firebase',
+          to: '/firebase',
+          icon: mdiFirebase,
+        },
         {
           text: 'Test',
           to: '/test',

playground/pages/firebase.vue

@@ -0,0 +1,44 @@
+<script setup lang="ts">
+import { doc } from 'firebase/firestore'
+
+// Firebase
+const db = useFirestore()
+
+// Connect to Firestore
+const docRef = doc(db, 'test', '123')
+
+// Page info
+useSeoMeta({
+  title: 'Firebase',
+})
+</script>
+
+<template>
+  <v-container>
+    <v-row>
+      <v-col cols="12">
+        <v-container>
+          <v-row>
+            <v-col cols="12">
+              <h1>Firebase</h1>
+            </v-col>
+          </v-row>
+
+          <!-- Firebase File Upload Dialog -->
+          <v-row>
+            <v-col cols="12">
+              <v-card class="pa-4">
+                <h2>FirebaseFileUploadDialog</h2>
+                <FirebaseFileUploadDialog
+                  :doc-ref
+                  :upload-path="`test/123`"
+                  upload-field-name="test"
+                />
+              </v-card>
+            </v-col>
+          </v-row>
+        </v-container>
+      </v-col>
+    </v-row>
+  </v-container>
+</template>