From bb56d58b9fff5b53ac54069f7eed62487fde5d61 Mon Sep 17 00:00:00 2001
From: Alfred Nutile <alfrednutile@gmail.com>
Date: Tue, 11 Jun 2024 16:56:23 -0400
Subject: [PATCH] add the settings page now to make it work

---
 app/Http/Controllers/SettingController.php    | 122 ++++++++++++++++++
 app/Http/Resources/SettingResource.php        |  19 +++
 app/Models/Setting.php                        |  25 ++++
 database/factories/SettingFactory.php         |  39 ++++++
 ...024_06_11_183813_create_settings_table.php |  31 +++++
 resources/js/Components/ActionMessage.vue     |   2 +-
 resources/js/Components/FormSection.vue       |   6 +-
 resources/js/Components/SectionTitle.vue      |   4 +-
 .../Pages/Settings/Partials/ClaudeSecrets.vue |  75 +++++++++++
 .../Pages/Settings/Partials/GroqSecrets.vue   |  89 +++++++++++++
 .../Settings/Partials/OllamaApiSecrets.vue    |  88 +++++++++++++
 .../Pages/Settings/Partials/OpenAiSecrets.vue |  89 +++++++++++++
 resources/js/Pages/Settings/Show.vue          |  41 ++++++
 routes/web.php                                |  15 +++
 .../Controllers/SettingControllerTest.php     |  49 +++++++
 tests/Feature/Models/SettingTest.php          |  23 ++++
 16 files changed, 711 insertions(+), 6 deletions(-)
 create mode 100644 app/Http/Controllers/SettingController.php
 create mode 100644 app/Http/Resources/SettingResource.php
 create mode 100644 app/Models/Setting.php
 create mode 100644 database/factories/SettingFactory.php
 create mode 100644 database/migrations/2024_06_11_183813_create_settings_table.php
 create mode 100644 resources/js/Pages/Settings/Partials/ClaudeSecrets.vue
 create mode 100644 resources/js/Pages/Settings/Partials/GroqSecrets.vue
 create mode 100644 resources/js/Pages/Settings/Partials/OllamaApiSecrets.vue
 create mode 100644 resources/js/Pages/Settings/Partials/OpenAiSecrets.vue
 create mode 100644 resources/js/Pages/Settings/Show.vue
 create mode 100644 tests/Feature/Http/Controllers/SettingControllerTest.php
 create mode 100644 tests/Feature/Models/SettingTest.php

diff --git a/app/Http/Controllers/SettingController.php b/app/Http/Controllers/SettingController.php
new file mode 100644
index 00000000..49f6209f
--- /dev/null
+++ b/app/Http/Controllers/SettingController.php
@@ -0,0 +1,122 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Http\Resources\SettingResource;
+use App\Models\Setting;
+use Illuminate\Http\Request;
+
+class SettingController extends Controller
+{
+    public function show()
+    {
+        if (! Setting::exists()) {
+            $setting = Setting::create([
+                'steps' => [
+                    'setup_secrets' => false,
+                ],
+                'meta_data' => [
+                    'openai' => [
+                        'models' => [],
+                    ],
+                ],
+                'secrets' => [
+                    'openai' => [
+                        'api_key' => null,
+                        'api_url' => 'https://api.openai.com/v1',
+                    ],
+                    'claude' => [
+                        'api_key' => null,
+                    ],
+                    'groq' => [
+                        'api_key' => null,
+                        'api_url' => 'https://api.groq.com/openai/v1/',
+                    ],
+                    'ollama' => [
+                        'api_key' => 'ollama',
+                        'api_url' => 'http://localhost:11434/api/',
+                    ],
+                ],
+            ]);
+        } else {
+            $setting = Setting::first();
+        }
+
+        return inertia('Settings/Show', [
+            'setting' => new SettingResource($setting),
+        ]);
+    }
+
+    protected function updateStep(Setting $setting): Setting
+    {
+        $steps = $setting->steps;
+        $steps['setup_secrets'] = true;
+        $setting->steps = $steps;
+        $setting->save();
+
+        return $setting;
+    }
+
+    public function updateClaude(Request $request, Setting $setting)
+    {
+        $validated = $request->validate([
+            'api_key' => 'string|required',
+        ]);
+
+        $secrets = $setting->secrets;
+        $secrets['claude'] = $validated;
+        $setting->secrets = $secrets;
+        $setting->save();
+        $this->updateStep($setting);
+
+        return back();
+    }
+
+    public function updateOllama(Request $request, Setting $setting)
+    {
+        $validated = $request->validate([
+            'api_key' => 'string|required',
+            'api_url' => 'string|required',
+        ]);
+
+        $secrets = $setting->secrets;
+        $secrets['ollama'] = $validated;
+        $setting->secrets = $secrets;
+        $setting->save();
+        $this->updateStep($setting);
+
+        return back();
+    }
+
+    public function updateGroq(Request $request, Setting $setting)
+    {
+        $validated = $request->validate([
+            'api_key' => 'string|required',
+            'api_url' => 'string|required',
+        ]);
+
+        $secrets = $setting->secrets;
+        $secrets['groq'] = $validated;
+        $setting->secrets = $secrets;
+        $setting->save();
+        $this->updateStep($setting);
+
+        return back();
+    }
+
+    public function updateOpenAi(Request $request, Setting $setting)
+    {
+        $validated = $request->validate([
+            'api_key' => 'string|required',
+            'api_url' => 'string|required',
+        ]);
+
+        $secrets = $setting->secrets;
+        $secrets['openai'] = $validated;
+        $setting->secrets = $secrets;
+        $setting->save();
+        $this->updateStep($setting);
+
+        return back();
+    }
+}
diff --git a/app/Http/Resources/SettingResource.php b/app/Http/Resources/SettingResource.php
new file mode 100644
index 00000000..f05e431a
--- /dev/null
+++ b/app/Http/Resources/SettingResource.php
@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Http\Resources;
+
+use Illuminate\Http\Request;
+use Illuminate\Http\Resources\Json\JsonResource;
+
+class SettingResource extends JsonResource
+{
+    /**
+     * Transform the resource into an array.
+     *
+     * @return array<string, mixed>
+     */
+    public function toArray(Request $request): array
+    {
+        return parent::toArray($request);
+    }
+}
diff --git a/app/Models/Setting.php b/app/Models/Setting.php
new file mode 100644
index 00000000..c8f9ad1e
--- /dev/null
+++ b/app/Models/Setting.php
@@ -0,0 +1,25 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Factories\HasFactory;
+use Illuminate\Database\Eloquent\Model;
+use Illuminate\Database\Eloquent\Relations\BelongsTo;
+
+class Setting extends Model
+{
+    use HasFactory;
+
+    protected $guarded = [];
+
+    protected $casts = [
+        'steps' => 'array',
+        'meta_data' => 'array',
+        'secrets' => 'encrypted:array',
+    ];
+
+    public function user(): BelongsTo
+    {
+        return $this->belongsTo(User::class);
+    }
+}
diff --git a/database/factories/SettingFactory.php b/database/factories/SettingFactory.php
new file mode 100644
index 00000000..9697ef57
--- /dev/null
+++ b/database/factories/SettingFactory.php
@@ -0,0 +1,39 @@
+<?php
+
+namespace Database\Factories;
+
+use App\Models\User;
+use Illuminate\Database\Eloquent\Factories\Factory;
+
+/**
+ * @extends \Illuminate\Database\Eloquent\Factories\Factory<\App\Models\Setting>
+ */
+class SettingFactory extends Factory
+{
+    /**
+     * Define the model's default state.
+     *
+     * @return array<string, mixed>
+     */
+    public function definition(): array
+    {
+        return [
+            'steps' => [
+                'setup_secrets' => false,
+            ],
+            'meta_data' => [
+                'openai' => [
+                    'models' => [
+                        'completion_model' => 'gpt-3.5-turbo',
+                    ],
+                ],
+            ],
+            'secrets' => [
+                'openai' => [
+                    'api_key' => 'foobar',
+                ],
+            ],
+            'user_id' => User::factory(),
+        ];
+    }
+}
diff --git a/database/migrations/2024_06_11_183813_create_settings_table.php b/database/migrations/2024_06_11_183813_create_settings_table.php
new file mode 100644
index 00000000..19d1607f
--- /dev/null
+++ b/database/migrations/2024_06_11_183813_create_settings_table.php
@@ -0,0 +1,31 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::create('settings', function (Blueprint $table) {
+            $table->id();
+            $table->json('steps')->nullable();
+            $table->json('meta_data')->nullable();
+            $table->longText('secrets')->nullable();
+            $table->foreignIdFor(\App\Models\User::class)->nullable();
+            $table->timestamps();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::dropIfExists('settings');
+    }
+};
diff --git a/resources/js/Components/ActionMessage.vue b/resources/js/Components/ActionMessage.vue
index 59741485..87d1d758 100644
--- a/resources/js/Components/ActionMessage.vue
+++ b/resources/js/Components/ActionMessage.vue
@@ -7,7 +7,7 @@ defineProps({
 <template>
     <div>
         <transition leave-active-class="transition ease-in duration-1000" leave-from-class="opacity-100" leave-to-class="opacity-0">
-            <div v-show="on" class="text-sm text-gray-600">
+            <div v-show="on" class="text-sm ">
                 <slot />
             </div>
         </transition>
diff --git a/resources/js/Components/FormSection.vue b/resources/js/Components/FormSection.vue
index 71c478ca..97aa3c65 100644
--- a/resources/js/Components/FormSection.vue
+++ b/resources/js/Components/FormSection.vue
@@ -8,7 +8,7 @@ const hasActions = computed(() => !! useSlots().actions);
 </script>
 
 <template>
-    <div class="md:grid md:grid-cols-3 md:gap-6">
+    <div class="md:grid md:grid-cols-3 md:gap-6 ">
         <SectionTitle>
             <template #title>
                 <slot name="title" />
@@ -21,7 +21,7 @@ const hasActions = computed(() => !! useSlots().actions);
         <div class="mt-5 md:mt-0 md:col-span-2">
             <form @submit.prevent="$emit('submitted')">
                 <div
-                    class="px-4 py-5 bg-white sm:p-6 shadow"
+                    class="px-4 py-5 sm:p-6 shadow"
                     :class="hasActions ? 'sm:rounded-tl-md sm:rounded-tr-md' : 'sm:rounded-md'"
                 >
                     <div class="grid grid-cols-6 gap-6">
@@ -29,7 +29,7 @@ const hasActions = computed(() => !! useSlots().actions);
                     </div>
                 </div>
 
-                <div v-if="hasActions" class="flex items-center justify-end px-4 py-3 bg-gray-50 text-end sm:px-6 shadow sm:rounded-bl-md sm:rounded-br-md">
+                <div v-if="hasActions" class="flex items-center justify-end px-4 py-3 text-end sm:px-6 shadow sm:rounded-bl-md sm:rounded-br-md">
                     <slot name="actions" />
                 </div>
             </form>
diff --git a/resources/js/Components/SectionTitle.vue b/resources/js/Components/SectionTitle.vue
index 273116e1..1d8cc48a 100644
--- a/resources/js/Components/SectionTitle.vue
+++ b/resources/js/Components/SectionTitle.vue
@@ -1,11 +1,11 @@
 <template>
     <div class="md:col-span-1 flex justify-between">
         <div class="px-4 sm:px-0">
-            <h3 class="text-lg font-medium text-gray-900">
+            <h3 class="text-lg font-medium">
                 <slot name="title" />
             </h3>
 
-            <p class="mt-1 text-sm text-gray-600">
+            <p class="mt-1 text-sm">
                 <slot name="description" />
             </p>
         </div>
diff --git a/resources/js/Pages/Settings/Partials/ClaudeSecrets.vue b/resources/js/Pages/Settings/Partials/ClaudeSecrets.vue
new file mode 100644
index 00000000..e2398346
--- /dev/null
+++ b/resources/js/Pages/Settings/Partials/ClaudeSecrets.vue
@@ -0,0 +1,75 @@
+<script setup>
+import { ref } from 'vue';
+import { Link, router, useForm } from '@inertiajs/vue3';
+import ActionMessage from '@/Components/ActionMessage.vue';
+import FormSection from '@/Components/FormSection.vue';
+import InputError from '@/Components/InputError.vue';
+import InputLabel from '@/Components/InputLabel.vue';
+import PrimaryButton from '@/Components/PrimaryButton.vue';
+import SecondaryButton from '@/Components/SecondaryButton.vue';
+import TextInput from '@/Components/TextInput.vue';
+
+const props = defineProps({
+    setting: Object,
+});
+
+const form = useForm({
+    _method: 'PUT',
+    api_key: props.setting.secrets?.claude?.api_key,
+});
+
+
+const updateSecrets = () => {
+
+    form.put(route('settings.update.claude', {
+        setting: props.setting.id,
+    }), {
+        errorBag: 'updateProfileInformation',
+        preserveScroll: true,
+    });
+};
+
+</script>
+
+<template>
+    <FormSection @submitted="updateSecrets">
+        <template #title>
+            Claude API Key and Token
+        </template>
+
+        <template #description>
+            If you want to use this service make sure to setup your API Token.
+            You can get your keys
+            <a
+                class="underline"
+                href="https://docs.anthropic.com/en/docs/intro-to-claude" target="_blank">here</a>
+        </template>
+
+        <template #form>
+
+
+            <!-- Name -->
+            <div class="col-span-6 sm:col-span-4">
+                <InputLabel for="name" value="Api Token" />
+                <TextInput
+                    id="name"
+                    v-model="form.api_key"
+                    type="text"
+                    class="mt-1 block w-full"
+                    required
+                />
+                <InputError :message="form.errors.api_key" class="mt-2" />
+            </div>
+        </template>
+
+        <template #actions>
+            <ActionMessage :on="form.recentlySuccessful" class="me-3">
+                Saved.
+            </ActionMessage>
+
+            <PrimaryButton :class="{ 'opacity-25': form.processing }" :disabled="form.processing">
+                Save
+            </PrimaryButton>
+        </template>
+    </FormSection>
+</template>
diff --git a/resources/js/Pages/Settings/Partials/GroqSecrets.vue b/resources/js/Pages/Settings/Partials/GroqSecrets.vue
new file mode 100644
index 00000000..9a036d12
--- /dev/null
+++ b/resources/js/Pages/Settings/Partials/GroqSecrets.vue
@@ -0,0 +1,89 @@
+<script setup>
+import { ref } from 'vue';
+import { Link, router, useForm } from '@inertiajs/vue3';
+import ActionMessage from '@/Components/ActionMessage.vue';
+import FormSection from '@/Components/FormSection.vue';
+import InputError from '@/Components/InputError.vue';
+import InputLabel from '@/Components/InputLabel.vue';
+import PrimaryButton from '@/Components/PrimaryButton.vue';
+import SecondaryButton from '@/Components/SecondaryButton.vue';
+import TextInput from '@/Components/TextInput.vue';
+
+const props = defineProps({
+    setting: Object,
+});
+
+const form = useForm({
+    _method: 'PUT',
+    api_key: props.setting.secrets?.groq?.api_key,
+    api_url: props.setting.secrets?.groq?.api_url,
+});
+
+
+const updateSecrets = () => {
+
+    form.put(route('settings.update.groq', {
+        setting: props.setting.id,
+    }), {
+        errorBag: 'updateProfileInformation',
+        preserveScroll: true,
+    });
+};
+
+</script>
+
+<template>
+    <FormSection @submitted="updateSecrets">
+        <template #title>
+            Add Groq Token and Url
+        </template>
+
+        <template #description>
+            If you want to use this service make sure to setup your API Token.
+            You can leave the url as is unless you are using Azure for example.
+            You can get your keys
+            <a
+                class="underline"
+                href="https://console.groq.com/docs/quickstart" target="_blank">here</a>
+        </template>
+
+        <template #form>
+
+
+            <!-- Name -->
+            <div class="col-span-6 sm:col-span-4">
+                <InputLabel for="name" value="Api Token" />
+                <TextInput
+                    id="name"
+                    v-model="form.api_key"
+                    type="text"
+                    class="mt-1 block w-full"
+                    required
+                />
+                <InputError :message="form.errors.api_key" class="mt-2" />
+            </div>
+
+            <div class="col-span-6 sm:col-span-4">
+                <InputLabel for="name" value="Api Url" />
+                <TextInput
+                    id="name"
+                    v-model="form.api_url"
+                    type="text"
+                    class="mt-1 block w-full"
+                    required
+                />
+                <InputError :message="form.errors.api_url" class="mt-2" />
+            </div>
+        </template>
+
+        <template #actions>
+            <ActionMessage :on="form.recentlySuccessful" class="me-3">
+                Saved.
+            </ActionMessage>
+
+            <PrimaryButton :class="{ 'opacity-25': form.processing }" :disabled="form.processing">
+                Save
+            </PrimaryButton>
+        </template>
+    </FormSection>
+</template>
diff --git a/resources/js/Pages/Settings/Partials/OllamaApiSecrets.vue b/resources/js/Pages/Settings/Partials/OllamaApiSecrets.vue
new file mode 100644
index 00000000..ce5aff54
--- /dev/null
+++ b/resources/js/Pages/Settings/Partials/OllamaApiSecrets.vue
@@ -0,0 +1,88 @@
+<script setup>
+import { ref } from 'vue';
+import { Link, router, useForm } from '@inertiajs/vue3';
+import ActionMessage from '@/Components/ActionMessage.vue';
+import FormSection from '@/Components/FormSection.vue';
+import InputError from '@/Components/InputError.vue';
+import InputLabel from '@/Components/InputLabel.vue';
+import PrimaryButton from '@/Components/PrimaryButton.vue';
+import SecondaryButton from '@/Components/SecondaryButton.vue';
+import TextInput from '@/Components/TextInput.vue';
+
+const props = defineProps({
+    setting: Object,
+});
+
+const form = useForm({
+    _method: 'PUT',
+    api_key: props.setting.secrets?.ollama?.api_key,
+    api_url: props.setting.secrets?.ollama?.api_url,
+});
+
+
+const updateSecrets = () => {
+
+    form.put(route('settings.update.ollama', {
+        setting: props.setting.id,
+    }), {
+        errorBag: 'updateProfileInformation',
+        preserveScroll: true,
+    });
+};
+
+</script>
+
+<template>
+    <FormSection @submitted="updateSecrets">
+        <template #title>
+            Add Ollama Token and Url
+        </template>
+
+        <template #description>
+            This service runs locally but sometimes is hosted
+            see the docs
+            <a
+                class="underline"
+                href="https://github.com/ollama/ollama/blob/main/docs/api.md" target="_blank">here</a>
+        </template>
+
+        <template #form>
+
+
+            <!-- Name -->
+            <div class="col-span-6 sm:col-span-4">
+                <InputLabel for="name" value="Api Token" />
+                <TextInput
+                    id="name"
+                    v-model="form.api_key"
+                    type="text"
+                    class="mt-1 block w-full"
+                    required
+                />
+                <InputError :message="form.errors.api_key" class="mt-2" />
+            </div>
+
+            <div class="col-span-6 sm:col-span-4">
+                <InputLabel for="name" value="Api Url" />
+                <TextInput
+                    id="name"
+                    v-model="form.api_url"
+                    type="text"
+                    class="mt-1 block w-full"
+                    required
+                />
+                <InputError :message="form.errors.api_url" class="mt-2" />
+            </div>
+        </template>
+
+        <template #actions>
+            <ActionMessage :on="form.recentlySuccessful" class="me-3">
+                Saved.
+            </ActionMessage>
+
+            <PrimaryButton :class="{ 'opacity-25': form.processing }" :disabled="form.processing">
+                Save
+            </PrimaryButton>
+        </template>
+    </FormSection>
+</template>
diff --git a/resources/js/Pages/Settings/Partials/OpenAiSecrets.vue b/resources/js/Pages/Settings/Partials/OpenAiSecrets.vue
new file mode 100644
index 00000000..3bb9dd93
--- /dev/null
+++ b/resources/js/Pages/Settings/Partials/OpenAiSecrets.vue
@@ -0,0 +1,89 @@
+<script setup>
+import { ref } from 'vue';
+import { Link, router, useForm } from '@inertiajs/vue3';
+import ActionMessage from '@/Components/ActionMessage.vue';
+import FormSection from '@/Components/FormSection.vue';
+import InputError from '@/Components/InputError.vue';
+import InputLabel from '@/Components/InputLabel.vue';
+import PrimaryButton from '@/Components/PrimaryButton.vue';
+import SecondaryButton from '@/Components/SecondaryButton.vue';
+import TextInput from '@/Components/TextInput.vue';
+
+const props = defineProps({
+    setting: Object,
+});
+
+const form = useForm({
+    _method: 'PUT',
+    api_key: props.setting.secrets?.openai?.api_key,
+    api_url: props.setting.secrets?.openai?.api_url,
+});
+
+
+const updateSecrets = () => {
+
+    form.put(route('settings.update.open_ai', {
+        setting: props.setting.id,
+    }), {
+        errorBag: 'updateProfileInformation',
+        preserveScroll: true,
+    });
+};
+
+</script>
+
+<template>
+    <FormSection @submitted="updateSecrets">
+        <template #title>
+            Add OpenAI Token and Url
+        </template>
+
+        <template #description>
+            If you want to use this service make sure to setup your API Token.
+            You can leave the url as is unless you are using Azure for example.
+            You can get your keys
+            <a
+                class="underline"
+                href="https://platform.openai.com/api-keys" target="_blank">here</a>
+        </template>
+
+        <template #form>
+
+
+            <!-- Name -->
+            <div class="col-span-6 sm:col-span-4">
+                <InputLabel for="name" value="Api Token" />
+                <TextInput
+                    id="name"
+                    v-model="form.api_key"
+                    type="text"
+                    class="mt-1 block w-full"
+                    required
+                />
+                <InputError :message="form.errors.api_key" class="mt-2" />
+            </div>
+
+            <div class="col-span-6 sm:col-span-4">
+                <InputLabel for="name" value="Api Url" />
+                <TextInput
+                    id="name"
+                    v-model="form.api_url"
+                    type="text"
+                    class="mt-1 block w-full"
+                    required
+                />
+                <InputError :message="form.errors.api_url" class="mt-2" />
+            </div>
+        </template>
+
+        <template #actions>
+            <ActionMessage :on="form.recentlySuccessful" class="me-3">
+                Saved.
+            </ActionMessage>
+
+            <PrimaryButton :class="{ 'opacity-25': form.processing }" :disabled="form.processing">
+                Save
+            </PrimaryButton>
+        </template>
+    </FormSection>
+</template>
diff --git a/resources/js/Pages/Settings/Show.vue b/resources/js/Pages/Settings/Show.vue
new file mode 100644
index 00000000..944742b3
--- /dev/null
+++ b/resources/js/Pages/Settings/Show.vue
@@ -0,0 +1,41 @@
+<script setup>
+import AppLayout from '@/Layouts/AppLayout.vue';
+import SectionBorder from '@/Components/SectionBorder.vue';
+import OpenAiSecrets from "@/Pages/Settings/Partials/OpenAiSecrets.vue";
+import ClaudeSecrets from "@/Pages/Settings/Partials/ClaudeSecrets.vue";
+import OllamaApiSecrets from "@/Pages/Settings/Partials/OllamaApiSecrets.vue";
+import GroqSecrets from "@/Pages/Settings/Partials/GroqSecrets.vue";
+
+const props = defineProps({
+    setting: Object,
+});
+</script>
+
+<template>
+    <AppLayout title="Settings">
+
+        <div class="py-12">
+            <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
+               <div>
+                   <OpenAiSecrets :setting="setting.data"/>
+                   <SectionBorder/>
+               </div>
+
+                <div>
+                    <ClaudeSecrets :setting="setting.data"/>
+                    <SectionBorder/>
+                </div>
+
+                <div>
+                    <OllamaApiSecrets :setting="setting.data"/>
+                    <SectionBorder/>
+                </div>
+
+                <div>
+                    <GroqSecrets :setting="setting.data"/>
+                    <SectionBorder/>
+                </div>
+            </div>
+        </div>
+    </AppLayout>
+</template>
diff --git a/routes/web.php b/routes/web.php
index 55b56fcb..48134ac3 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -117,6 +117,21 @@ function () {
         }
     );
 
+    Route::controller(\App\Http\Controllers\SettingController::class)->group(
+        function () {
+            Route::get('/settings', 'show')
+                ->name('settings.show');
+            Route::put('/settings/{setting}/open_ai', 'updateOpenAi')
+                ->name('settings.update.open_ai');
+            Route::put('/settings/{setting}/claude', 'updateClaude')
+                ->name('settings.update.claude');
+            Route::put('/settings/{setting}/ollama', 'updateOllama')
+                ->name('settings.update.ollama');
+            Route::put('/settings/{setting}/groq', 'updateGroq')
+                ->name('settings.update.groq');
+        }
+    );
+
     Route::controller(WebSourceController::class)->group(
         function () {
             Route::get('/collections/{collection}/sources/web_search_source/create', 'create')
diff --git a/tests/Feature/Http/Controllers/SettingControllerTest.php b/tests/Feature/Http/Controllers/SettingControllerTest.php
new file mode 100644
index 00000000..7456deff
--- /dev/null
+++ b/tests/Feature/Http/Controllers/SettingControllerTest.php
@@ -0,0 +1,49 @@
+<?php
+
+namespace Tests\Feature\Http\Controllers;
+
+use App\Models\Setting;
+use App\Models\User;
+use Tests\TestCase;
+
+class SettingControllerTest extends TestCase
+{
+    /**
+     * A basic feature test example.
+     */
+    public function test_show_makes(): void
+    {
+        $user = User::factory()->create();
+
+        $this->assertDatabaseCount('settings', 0);
+
+        $response = $this
+            ->actingAs($user)
+            ->get(route('settings.show'))
+            ->assertStatus(200);
+
+        $this->assertDatabaseCount('settings', 1);
+    }
+
+    public function test_updates_open_ai(): void
+    {
+        $user = User::factory()->create();
+
+        $setting = Setting::factory()->create();
+
+        $response = $this
+            ->actingAs($user)
+            ->put(route('settings.update.open_ai', $setting), [
+                'api_key' => 'foobar',
+                'api_url' => 'https://api.openai.com/v1',
+            ])
+            ->assertSessionHasNoErrors();
+
+        $setting = Setting::first();
+
+        $this->assertEquals('foobar', $setting->secrets['openai']['api_key']);
+        $this->assertEquals('https://api.openai.com/v1', $setting->secrets['openai']['api_url']);
+
+        $this->assertTrue($setting->steps['setup_secrets']);
+    }
+}
diff --git a/tests/Feature/Models/SettingTest.php b/tests/Feature/Models/SettingTest.php
new file mode 100644
index 00000000..6409995a
--- /dev/null
+++ b/tests/Feature/Models/SettingTest.php
@@ -0,0 +1,23 @@
+<?php
+
+namespace Tests\Feature\Models;
+
+use App\Models\Setting;
+use Tests\TestCase;
+
+class SettingTest extends TestCase
+{
+    /**
+     * A basic feature test example.
+     */
+    public function test_model(): void
+    {
+
+        $model = Setting::factory()->create();
+
+        $this->assertNotNull($model->meta_data);
+        $this->assertNotNull($model->secrets);
+        $this->assertNotNull($model->user_id);
+        $this->assertNotNull($model->user->id);
+    }
+}