feat: In-app AI Provider Configuration (#7650)

frontend/app/pages/g/[groupSlug]/r/create.vue

@@ -45,6 +45,7 @@
 <script setup lang="ts">
 import type { MenuItem } from "~/components/global/BaseOverflowButton.vue";
 import AdvancedOnly from "~/components/global/AdvancedOnly.vue";
+import { useGroupSelf } from "~/composables/use-groups";
 
 definePageMeta({
   middleware: ["group-only"],
@@ -52,7 +53,8 @@ definePageMeta({
 
 const i18n = useI18n();
 const auth = useMealieAuth();
-const { $appInfo, $globals } = useNuxtApp();
+const { $globals } = useNuxtApp();
+const { group } = useGroupSelf();
 
 useSeoMeta({
   title: i18n.t("general.create"),
@@ -78,7 +80,7 @@ const subpages = computed<MenuItem[]>(() => [
     icon: $globals.icons.fileImage,
     text: i18n.t("recipe.create-from-images"),
     value: "image",
-    hide: !$appInfo.enableOpenaiImageServices,
+    hide: !group.value?.aiProviderSettings?.imageProviderEnabled,
   },
   {
     icon: $globals.icons.edit,

frontend/app/pages/g/[groupSlug]/r/create/debug.vue

@@ -25,7 +25,7 @@
             persistent-hint
           />
         </v-card-text>
-        <v-card-text v-if="$appInfo.enableOpenai">
+        <v-card-text v-if="group?.aiProviderSettings?.aiEnabled">
           {{ $t('recipe.recipe-debugger-use-openai-description') }}
           <v-checkbox
             v-model="state.useOpenAI"
@@ -69,6 +69,7 @@
 
 <script setup lang="ts">
 import { useUserApi } from "~/composables/api";
+import { useGroupSelf } from "~/composables/use-groups";
 import { validators } from "~/composables/use-validators";
 import type { Recipe } from "~/lib/api/types/recipe";
 
@@ -80,6 +81,7 @@ const state = reactive({
 const api = useUserApi();
 const route = useRoute();
 const router = useRouter();
+const { group } = useGroupSelf();
 
 const recipeUrl = computed({
   set(recipe_import_url: string | null) {

frontend/app/pages/g/[groupSlug]/r/create/url.vue

@@ -11,7 +11,7 @@
         <v-card-text>
           <v-card-text class="pa-0">
             <p>{{ $t('recipe.scrape-recipe-description') }}</p>
-            <p v-if="$appInfo.enableOpenaiTranscriptionServices">
+            <p v-if="group?.aiProviderSettings?.audioProviderEnabled">
               {{ $t('recipe.scrape-recipe-description-transcription') }}
             </p>
           </v-card-text>
@@ -145,6 +145,7 @@
 <script setup lang="ts">
 import type { AxiosResponse } from "axios";
 import { useUserApi } from "~/composables/api";
+import { useGroupSelf } from "~/composables/use-groups";
 import { useTagStore } from "~/composables/store/use-tag-store";
 import { useNewRecipeOptions } from "~/composables/use-new-recipe-options";
 import { validators } from "~/composables/use-validators";
@@ -162,6 +163,7 @@ const auth = useMealieAuth();
 const api = useUserApi();
 const route = useRoute();
 const groupSlug = computed(() => route.params.groupSlug as string || auth.user.value?.groupSlug || "");
+const { group } = useGroupSelf();
 
 const router = useRouter();
 const tags = useTagStore();