feat: add team page

Author: Adelino Ngomacha

libs/components/Dashboard/Settings/Forms/TeamsForm.vue

@@ -0,0 +1,85 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+  <div class="bg-white">
+    <div class="mx-auto max-w-7xl px-6 lg:px-8">
+      <ul role="list" class="mx-auto mt-20 grid max-w-2xl grid-cols-2 gap-x-8 gap-y-16 text-center sm:grid-cols-3 md:grid-cols-4 lg:mx-0 lg:max-w-none lg:grid-cols-5 xl:grid-cols-6">
+        <li>
+          <img class="mx-auto h-24 w-24 rounded-full" src="https://pbs.twimg.com/profile_images/1707883193054228480/n98q6t1L_400x400.jpg" alt="">
+          <h3 class="mt-6 text-base font-semibold leading-7 tracking-tight text-gray-900">
+            Chris
+          </h3>
+          <p class="text-sm leading-6 text-gray-600">
+            chris@stacksjs.org
+          </p>
+        </li>
+
+        <li>
+          <img class="mx-auto h-24 w-24 rounded-full" src="https://pbs.twimg.com/profile_images/1707883193054228480/n98q6t1L_400x400.jpg" alt="">
+          <h3 class="mt-6 text-base font-semibold leading-7 tracking-tight text-gray-900">
+            Blake
+          </h3>
+          <p class="text-sm leading-6 text-gray-600">
+            blake@stacksjs.org
+          </p>
+        </li>
+
+        <li>
+          <img class="mx-auto h-24 w-24 rounded-full" src="https://pbs.twimg.com/profile_images/1707883193054228480/n98q6t1L_400x400.jpg" alt="">
+          <h3 class="mt-6 text-base font-semibold leading-7 tracking-tight text-gray-900">
+            Zoltan
+          </h3>
+          <p class="text-sm leading-6 text-gray-600">
+            zoltan@stacksjs.org
+          </p>
+        </li>
+
+        <li>
+          <img class="mx-auto h-24 w-24 rounded-full" src="https://pbs.twimg.com/profile_images/1707883193054228480/n98q6t1L_400x400.jpg" alt="">
+          <h3 class="mt-6 text-base font-semibold leading-7 tracking-tight text-gray-900">
+            Freddy
+          </h3>
+          <p class="text-sm leading-6 text-gray-600">
+            freddy@stacksjs.org
+          </p>
+        </li>
+
+        <li>
+          <img class="mx-auto h-24 w-24 rounded-full" src="https://pbs.twimg.com/profile_images/1707883193054228480/n98q6t1L_400x400.jpg" alt="">
+          <h3 class="mt-6 text-base font-semibold leading-7 tracking-tight text-gray-900">
+            Glenn
+          </h3>
+          <p class="text-sm leading-6 text-gray-600">
+            glenn@stacksjs.org
+          </p>
+        </li>
+
+        <li>
+          <img class="mx-auto h-24 w-24 rounded-full" src="https://pbs.twimg.com/profile_images/1707883193054228480/n98q6t1L_400x400.jpg" alt="">
+          <h3 class="mt-6 text-base font-semibold leading-7 tracking-tight text-gray-900">
+            Dorell
+          </h3>
+          <p class="text-sm leading-6 text-gray-600">
+            dorell@stacksjs.org
+          </p>
+        </li>
+
+        <li>
+          <img class="mx-auto h-24 w-24 rounded-full" src="https://pbs.twimg.com/profile_images/1707883193054228480/n98q6t1L_400x400.jpg" alt="">
+          <h3 class="mt-6 text-base font-semibold leading-7 tracking-tight text-gray-900">
+            Avery
+          </h3>
+          <p class="text-sm leading-6 text-gray-600">
+            avery@stacksjs.org
+          </p>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+
+</style>

libs/components/Dashboard/Settings/SettingsFormManager.vue

@@ -16,6 +16,7 @@ import SearchEngineForm from './Forms/SearchEngineForm.vue'
 import SecurityForm from './Forms/SecurityForm.vue'
 import ServicesForm from './Forms/ServicesForm.vue'
 import StorageForm from './Forms/StorageForm.vue'
+import TeamsForm from './Forms/TeamsForm.vue'
 
 const props = defineProps({
   name: String,
@@ -142,6 +143,7 @@ const pageTitle = computed < String > (() => options.find(option => option.key =
         <template v-else-if="name === 'security'"><SecurityForm /></template>
         <template v-else-if="name === 'services'"><ServicesForm /></template>
         <template v-else-if="name === 'storage'"><StorageForm /></template>
+        <template v-else-if="name === 'team'"><TeamsForm /></template>
         <template v-else>
           <div class="text-center">
             <div class="i-heroicons-cog-8-tooth text-gray-400 w-12 h-12 dark:text-gray-200 transition-all duration-150 ease-in-out" />