change: consume api in resources

app/Http/Controllers/AdminController.php

@@ -2,490 +2,48 @@
 
 namespace App\Http\Controllers;
 
-use App\Exceptions\RagApiException;
-use Illuminate\Http\RedirectResponse;
-use Illuminate\Http\Request;
-use Illuminate\Validation\Rule;
 use Inertia\Inertia;
 use Inertia\Response;
 
 class AdminController extends Controller
 {
-    private const AUTH_TOKEN_COOKIE = 'sevima_raghub_auth_token';
-
-    public function index(Request $request): Response
+    public function index(): Response
     {
-        $users = [];
-        $token = $this->authToken($request);
-        $userFilters = $this->userFilters($request);
-        $configPayload = $this->resolveRagConfig($token);
-        $backendMessage = $configPayload['backendMessage'];
-
-        try {
-            $users = $this->listUsers($userFilters, $token)['founds'] ?? [];
-        } catch (RagApiException $exception) {
-            $backendMessage ??= $exception->getMessage() ?: null;
-        }
-
-        return Inertia::render('admin/dashboard', [
-            'backendMessage' => $backendMessage,
-            'generatedApiKey' => $request->session()->get('generatedApiKey'),
-            'ragConfig' => $configPayload['ragConfig'],
-            'userFilters' => $userFilters,
-            'users' => $users,
-        ]);
+        return Inertia::render('admin/dashboard');
     }
 
-    public function ragConfig(Request $request): Response
+    public function ragConfig(): Response
     {
-        $configPayload = $this->resolveRagConfig($this->authToken($request));
-
-        return Inertia::render('admin/rag-config', $configPayload);
+        return Inertia::render('admin/rag-config');
     }
 
-    public function llmConfig(Request $request): Response
+    public function llmConfig(): Response
     {
-        $configPayload = $this->resolveRagConfig($this->authToken($request), ['llm']);
-
-        return Inertia::render('admin/llm-config', $configPayload);
+        return Inertia::render('admin/llm-config');
     }
 
-    public function vectorRetrievalConfig(Request $request): Response
+    public function vectorRetrievalConfig(): Response
     {
-        $configPayload = $this->resolveRagConfig($this->authToken($request), ['vector_db', 'retrieval']);
-
-        return Inertia::render('admin/vector-retrieval-config', $configPayload);
+        return Inertia::render('admin/vector-retrieval-config');
     }
 
-    public function vectorDbConfig(Request $request): Response
+    public function vectorDbConfig(): Response
     {
-        $configPayload = $this->resolveRagConfig($this->authToken($request), ['vector_db']);
-
-        return Inertia::render('admin/vectordb-config', $configPayload);
+        return Inertia::render('admin/vectordb-config');
     }
 
-    public function retrievalConfig(Request $request): Response
+    public function retrievalConfig(): Response
     {
-        $configPayload = $this->resolveRagConfig($this->authToken($request), ['retrieval']);
-
-        return Inertia::render('admin/retrieval-config', $configPayload);
+        return Inertia::render('admin/retrieval-config');
     }
 
-    public function apiKeys(Request $request): Response
+    public function apiKeys(): Response
     {
-        return Inertia::render('admin/api-keys', [
-            'generatedApiKey' => $request->session()->get('generatedApiKey'),
-        ]);
+        return Inertia::render('admin/api-keys');
     }
 
     public function settings(): Response
     {
         return Inertia::render('admin/pengaturan');
     }
-
-    public function generateApiKey(Request $request): RedirectResponse
-    {
-        try {
-            $apiKey = $this->generateApiKeyOnApi($this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()->withErrors(['apiKey' => $exception->getMessage()]);
-        }
-
-        return to_route('admin.api-keys.index')
-            ->with('generatedApiKey', $apiKey)
-            ->with('toast', [
-                'message' => 'API key berhasil dibuat.',
-                'type' => 'success',
-            ]);
-    }
-
-    public function updateLlmConfig(Request $request): RedirectResponse
-    {
-        $payload = $this->cleanPayload($request->validate([
-            'api_key_env' => ['nullable', 'string'],
-            'base_url' => ['nullable', 'string'],
-            'max_tokens' => ['nullable', 'integer', 'min:1'],
-            'model' => ['nullable', 'string'],
-            'provider' => ['nullable', 'string'],
-            'reasoning_effort' => ['nullable', 'string'],
-            'request_timeout' => ['nullable', 'integer', 'min:1'],
-            'system_prompt' => ['nullable', 'string'],
-            'temperature' => ['nullable', 'numeric', 'min:0'],
-        ]));
-
-        try {
-            $this->updateLlmConfigOnApi($payload, $this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()
-                ->withErrors(['llm' => $exception->getMessage()])
-                ->withInput();
-        }
-
-        return $this->adminSuccess('Konfigurasi LLM berhasil diperbarui.', 'admin.llm-config');
-    }
-
-    public function updateVectorDbConfig(Request $request): RedirectResponse
-    {
-        $payload = $this->cleanPayload($request->validate([
-            'chunk_overlap' => ['nullable', 'integer', 'min:0'],
-            'chunk_size' => ['nullable', 'integer', 'min:1'],
-            'embedding_model' => ['nullable', 'string'],
-            'persist_path' => ['nullable', 'string'],
-        ]));
-
-        try {
-            $this->updateVectorDbConfigOnApi($payload, $this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()
-                ->withErrors(['vectorDb' => $exception->getMessage()])
-                ->withInput();
-        }
-
-        return $this->adminSuccess('Konfigurasi Vector DB berhasil diperbarui.', 'admin.vectordb-config');
-    }
-
-    public function updateRetrievalConfig(Request $request): RedirectResponse
-    {
-        $payload = $this->cleanPayload($request->validate([
-            'bm25_weight' => ['nullable', 'numeric', 'min:0', 'max:1'],
-            'candidate_pool_size' => ['nullable', 'integer', 'min:1'],
-            'dense_weight' => ['nullable', 'numeric', 'min:0', 'max:1'],
-            'enable_reranker' => ['sometimes', 'boolean'],
-            'history_turns' => ['nullable', 'integer', 'min:0'],
-            'lexical_weight' => ['nullable', 'numeric', 'min:0', 'max:1'],
-            'max_context_chars' => ['nullable', 'integer', 'min:1'],
-            'neighbor_window' => ['nullable', 'integer', 'min:0'],
-            'reranker_model' => ['nullable', 'string'],
-            'similarity_threshold' => ['nullable', 'numeric', 'min:0'],
-            'top_k' => ['nullable', 'integer', 'min:1'],
-        ]));
-
-        try {
-            $this->updateRetrievalConfigOnApi($payload, $this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()
-                ->withErrors(['retrieval' => $exception->getMessage()])
-                ->withInput();
-        }
-
-        return $this->adminSuccess('Konfigurasi retrieval berhasil diperbarui.', 'admin.retrieval-config');
-    }
-
-    public function storeUser(Request $request): RedirectResponse
-    {
-        $payload = $this->cleanPayload($this->validatedUserPayload($request));
-
-        try {
-            $this->createUser($payload, $this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()
-                ->withErrors(['user' => $exception->getMessage()])
-                ->withInput();
-        }
-
-        return $this->adminSuccess('User berhasil dibuat.');
-    }
-
-    public function updateUser(Request $request, string $userId): RedirectResponse
-    {
-        $payload = $this->cleanPayload($this->validatedUserPayload($request));
-
-        try {
-            $this->updateUserOnApi($userId, $payload, $this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()
-                ->withErrors(['user' => $exception->getMessage()])
-                ->withInput();
-        }
-
-        return $this->adminSuccess('User berhasil diperbarui.');
-    }
-
-    public function destroyUser(Request $request, string $userId): RedirectResponse
-    {
-        try {
-            $this->deleteUser($userId, $this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()->withErrors(['user' => $exception->getMessage()]);
-        }
-
-        return $this->adminSuccess('User berhasil dihapus.');
-    }
-
-    private function authToken(Request $request): ?string
-    {
-        $token = $request->cookie(self::AUTH_TOKEN_COOKIE);
-
-        return is_string($token) && $token !== '' ? $token : null;
-    }
-
-    /**
-     * @return array<string, mixed>
-     */
-    private function userFilters(Request $request): array
-    {
-        return $this->cleanPayload($request->validate([
-            'email' => ['nullable', 'string'],
-            'identity_number' => ['nullable', 'string'],
-            'is_active' => ['nullable', 'boolean'],
-            'is_superuser' => ['nullable', 'boolean'],
-            'name' => ['nullable', 'string'],
-            'ordering' => ['nullable', 'string'],
-            'page' => ['nullable', 'integer', 'min:1'],
-            'page_size' => ['nullable'],
-            'phone' => ['nullable', 'string'],
-            'role' => ['nullable', Rule::in(['student', 'lecturer', 'admin'])],
-            'user_token' => ['nullable', 'string'],
-        ]));
-    }
-
-    /**
-     * @return array<string, mixed>
-     */
-    private function validatedUserPayload(Request $request): array
-    {
-        return $request->validate([
-            'email' => ['nullable', 'email'],
-            'identity_number' => ['nullable', 'string'],
-            'is_active' => ['sometimes', 'boolean'],
-            'is_superuser' => ['sometimes', 'boolean'],
-            'name' => ['nullable', 'string'],
-            'phone' => ['nullable', 'string'],
-            'role' => ['nullable', Rule::in(['student', 'lecturer', 'admin'])],
-            'user_token' => ['nullable', 'string'],
-        ]);
-    }
-
-    /**
-     * @param  array<string, mixed>  $payload
-     * @return array<string, mixed>
-     */
-    private function cleanPayload(array $payload): array
-    {
-        return array_filter(
-            $payload,
-            fn (mixed $value): bool => $value !== null && $value !== '',
-        );
-    }
-
-    private function adminSuccess(string $message, string $routeName = 'admin.dashboard'): RedirectResponse
-    {
-        return to_route($routeName)->with('toast', [
-            'message' => $message,
-            'type' => 'success',
-        ]);
-    }
-
-    /**
-     * @param  array<string, mixed>|null  $config
-     * @param  array<string, mixed>  $section
-     * @return array<string, mixed>
-     */
-    private function withConfigSection(?array $config, string $key, array $section): array
-    {
-        $config ??= [];
-        $config[$key] = $section;
-
-        return $config;
-    }
-
-    /**
-     * @param  array<int, 'llm'|'retrieval'|'vector_db'>  $sections
-     * @return array{backendMessage: string|null, ragConfig: array<string, mixed>|null}
-     */
-    private function resolveRagConfig(?string $token, array $sections = ['llm', 'vector_db', 'retrieval']): array
-    {
-        $backendMessage = null;
-        $ragConfig = null;
-
-        try {
-            $ragConfig = $this->getRagConfig($token);
-        } catch (RagApiException $exception) {
-            $backendMessage = $exception->getMessage() ?: null;
-        }
-
-        foreach ($sections as $section) {
-            try {
-                $ragConfig = match ($section) {
-                    'llm' => $this->withConfigSection($ragConfig, 'llm', $this->getLlmConfig($token)),
-                    'retrieval' => $this->withConfigSection($ragConfig, 'retrieval', $this->getRetrievalConfig($token)),
-                    'vector_db' => $this->withConfigSection($ragConfig, 'vector_db', $this->getVectorDbConfig($token)),
-                    default => $ragConfig,
-                };
-            } catch (RagApiException $exception) {
-                $backendMessage ??= $exception->getMessage() ?: null;
-            }
-        }
-
-        return [
-            'backendMessage' => $backendMessage,
-            'ragConfig' => $ragConfig,
-        ];
-    }
-
-    /**
-     * @return array{api_key: string, expires_at?: string|null}
-     */
-    private function generateApiKeyOnApi(?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->post('/auth/api-keys');
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array{api_key: string, expires_at?: string|null} */
-        return $response->json();
-    }
-
-    /**
-     * @return array<string, mixed>
-     */
-    private function getRagConfig(?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/admin/rag/config');
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @return array<string, mixed>
-     */
-    private function getLlmConfig(?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/admin/rag/config/llm');
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @param  array<string, mixed>  $payload
-     * @return array<string, mixed>
-     */
-    private function updateLlmConfigOnApi(array $payload, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)
-            ->asJson()
-            ->patch('/admin/rag/config/llm', $payload);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @return array<string, mixed>
-     */
-    private function getVectorDbConfig(?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/admin/rag/config/vector_db');
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @param  array<string, mixed>  $payload
-     * @return array<string, mixed>
-     */
-    private function updateVectorDbConfigOnApi(array $payload, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)
-            ->asJson()
-            ->patch('/admin/rag/config/vector_db', $payload);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @return array<string, mixed>
-     */
-    private function getRetrievalConfig(?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/admin/rag/config/retrieval');
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @param  array<string, mixed>  $payload
-     * @return array<string, mixed>
-     */
-    private function updateRetrievalConfigOnApi(array $payload, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)
-            ->asJson()
-            ->patch('/admin/rag/config/retrieval', $payload);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @param  array<string, mixed>  $query
-     * @return array{founds?: array<int, array<string, mixed>>, search_options?: array<string, mixed>}
-     */
-    private function listUsers(array $query = [], ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/user', $query);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array{founds?: array<int, array<string, mixed>>, search_options?: array<string, mixed>} */
-        return $response->json();
-    }
-
-    /**
-     * @param  array<string, mixed>  $payload
-     * @return array<string, mixed>
-     */
-    private function createUser(array $payload, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)
-            ->asJson()
-            ->post('/user', $payload);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @param  array<string, mixed>  $payload
-     * @return array<string, mixed>
-     */
-    private function updateUserOnApi(string $userId, array $payload, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)
-            ->asJson()
-            ->patch('/user/'.$this->encodePathSegment($userId), $payload);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    private function deleteUser(string $userId, ?string $token = null): void
-    {
-        $response = $this->ragRequest($token)->delete('/user/'.$this->encodePathSegment($userId));
-
-        $this->throwIfRagFailed($response);
-    }
 }

app/Http/Controllers/DosenController.php

@@ -2,316 +2,20 @@
 
 namespace App\Http\Controllers;
 
-use App\Exceptions\RagApiException;
-use Illuminate\Http\RedirectResponse;
-use Illuminate\Http\Request;
-use Illuminate\Http\UploadedFile;
 use Inertia\Inertia;
 use Inertia\Response;
-use RuntimeException;
 
 class DosenController extends Controller
 {
-    private const AUTH_TOKEN_COOKIE = 'sevima_raghub_auth_token';
-
-    public function index(Request $request): Response
-    {
-        $token = $this->authToken($request);
-
-        return Inertia::render('dosen', [
-            'knowledgeBases' => Inertia::defer(function () use ($token): array {
-                $knowledgeBases = [];
-
-                try {
-                    $courses = $this->listCourses(limit: 100, token: $token)['data'];
-
-                    foreach ($courses as $course) {
-                        $documents = [];
-
-                        if ($token !== null) {
-                            try {
-                                $documents = $this->listCourseDocuments((string) $course['id'], $token)['data'];
-                            } catch (RagApiException) {
-                                // skip per-course errors
-                            }
-                        }
-
-                        $knowledgeBases[] = $this->knowledgeBaseRow($course, $documents);
-                    }
-                } catch (RagApiException) {
-                    // return whatever we have
-                }
-
-                return $knowledgeBases;
-            }, rescue: true),
-        ]);
-    }
-
-    public function storeCourse(Request $request): RedirectResponse
+    public function index(): Response
     {
-        /** @var array{title: string, description?: string|null} $payload */
-        $payload = $request->validate([
-            'description' => ['nullable', 'string', 'max:1000'],
-            'title' => ['required', 'string', 'max:255'],
-        ]);
-
-        if (($payload['description'] ?? null) === null || $payload['description'] === '') {
-            unset($payload['description']);
-        }
-
-        try {
-            $this->createCourse($payload, $this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()
-                ->withErrors(['course' => $exception->getMessage()])
-                ->withInput();
-        }
-
-        return to_route('dosen');
+        return Inertia::render('dosen');
     }
 
-    public function show(Request $request, string $courseId): Response
+    public function show(string $courseId): Response
     {
-        $backendMessage = null;
-        $course = null;
-        $documents = [];
-        $token = $this->authToken($request);
-
-        try {
-            $course = $this->getCourse($courseId, $token);
-        } catch (RagApiException $exception) {
-            $backendMessage = $exception->getMessage() ?: null;
-        }
-
-        try {
-            $documents = $this->listCourseDocuments($courseId, $token)['data'];
-        } catch (RagApiException $exception) {
-            $backendMessage ??= $exception->getMessage() ?: null;
-        }
-
         return Inertia::render('dosen-detail', [
-            'backendMessage' => $backendMessage,
-            'course' => $course,
             'courseId' => $courseId,
-            'documents' => $documents,
-        ]);
-    }
-
-    public function updateCourse(Request $request, string $courseId): RedirectResponse
-    {
-        /** @var array{title: string, description?: string|null} $payload */
-        $payload = $request->validate([
-            'description' => ['nullable', 'string', 'max:1000'],
-            'title' => ['required', 'string', 'max:255'],
         ]);
-
-        if (($payload['description'] ?? null) === null || $payload['description'] === '') {
-            unset($payload['description']);
-        }
-
-        try {
-            $this->updateCourseOnApi($courseId, $payload, $this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()
-                ->withErrors(['course' => $exception->getMessage()])
-                ->withInput();
-        }
-
-        return to_route('dosen.show', ['courseId' => $courseId]);
-    }
-
-    public function destroyCourse(Request $request, string $courseId): RedirectResponse
-    {
-        try {
-            $this->deleteCourse($courseId, $this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()->withErrors(['course' => $exception->getMessage()]);
-        }
-
-        return to_route('dosen');
-    }
-
-    public function uploadDocument(Request $request, string $courseId): RedirectResponse
-    {
-        $validated = $request->validate([
-            'file' => ['required', 'file', 'mimes:pdf,ppt,pptx,txt', 'max:102400'],
-        ]);
-        /** @var UploadedFile $file */
-        $file = $validated['file'];
-
-        try {
-            $this->uploadDocumentToApi($courseId, $file, $this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()->withErrors(['file' => $exception->getMessage()]);
-        } catch (RuntimeException $exception) {
-            return back()->withErrors(['file' => $exception->getMessage()]);
-        }
-
-        return to_route('dosen.show', ['courseId' => $courseId]);
-    }
-
-    /**
-     * @return array{data: array<int, array<string, mixed>>, total?: int, page?: int, limit?: int}
-     */
-    private function listCourses(int $page = 1, int $limit = 100, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/courses', [
-            'limit' => $limit,
-            'page' => $page,
-        ]);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array{data: array<int, array<string, mixed>>, total?: int, page?: int, limit?: int} */
-        return $response->json();
-    }
-
-    /**
-     * @return array{data: array<int, array<string, mixed>>}
-     */
-    private function listCourseDocuments(string $courseId, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/courses/'.$this->encodePathSegment($courseId).'/documents');
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array{data: array<int, array<string, mixed>>} */
-        return $response->json();
-    }
-
-    /**
-     * @param  array{title: string, description?: string|null}  $payload
-     * @return array<string, mixed>
-     */
-    private function createCourse(array $payload, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)
-            ->asJson()
-            ->post('/courses', $payload);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @return array<string, mixed>
-     */
-    private function getCourse(string $courseId, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/courses/'.$this->encodePathSegment($courseId));
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @param  array{title?: string, description?: string|null}  $payload
-     * @return array<string, mixed>
-     */
-    private function updateCourseOnApi(string $courseId, array $payload, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)
-            ->asJson()
-            ->put('/courses/'.$this->encodePathSegment($courseId), $payload);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    private function deleteCourse(string $courseId, ?string $token = null): void
-    {
-        $response = $this->ragRequest($token)->delete('/courses/'.$this->encodePathSegment($courseId));
-
-        $this->throwIfRagFailed($response);
-    }
-
-    private function uploadDocumentToApi(string $courseId, UploadedFile $file, ?string $token = null): void
-    {
-        $stream = fopen($file->getRealPath() ?: $file->getPathname(), 'r');
-
-        if ($stream === false) {
-            throw new RuntimeException('Uploaded file could not be read.');
-        }
-
-        try {
-            $response = $this->ragRequest($token)
-                ->attach(
-                    'file',
-                    $stream,
-                    $file->getClientOriginalName(),
-                    ['Content-Type' => $file->getMimeType() ?: 'application/octet-stream'],
-                )
-                ->post('/documents/upload', [
-                    'course_id' => $courseId,
-                ]);
-        } finally {
-            fclose($stream);
-        }
-
-        $this->throwIfRagFailed($response);
-    }
-
-    private function authToken(Request $request): ?string
-    {
-        $token = $request->cookie(self::AUTH_TOKEN_COOKIE);
-
-        return is_string($token) && $token !== '' ? $token : null;
-    }
-
-    /**
-     * @param  array{id: int|string, title: string, description?: string|null}  $course
-     * @param  array<int, array<string, mixed>>  $documents
-     * @return array{id: string, name: string, documentCount: int, failedDocumentCount: int, hasError: bool, updatedAt: string}
-     */
-    private function knowledgeBaseRow(array $course, array $documents): array
-    {
-        $failedDocumentCount = count(array_filter(
-            $documents,
-            fn (array $document): bool => ($document['status'] ?? null) === 'failed'
-                || filled($document['error'] ?? null),
-        ));
-
-        return [
-            'documentCount' => count($documents),
-            'failedDocumentCount' => $failedDocumentCount,
-            'hasError' => $failedDocumentCount > 0,
-            'id' => (string) $course['id'],
-            'name' => $course['title'],
-            'updatedAt' => $this->formatUpdatedAt($this->latestDocumentUpdate($documents)),
-        ];
-    }
-
-    /**
-     * @param  array<int, array<string, mixed>>  $documents
-     */
-    private function latestDocumentUpdate(array $documents): ?string
-    {
-        $updatedAtValues = array_values(array_filter(
-            array_map(
-                fn (array $document): ?string => is_string($document['updated_at'] ?? null)
-                    ? $document['updated_at']
-                    : null,
-                $documents,
-            ),
-        ));
-
-        sort($updatedAtValues);
-
-        return $updatedAtValues[array_key_last($updatedAtValues)] ?? null;
-    }
-
-    private function formatUpdatedAt(?string $value): string
-    {
-        if ($value === null || $value === '') {
-            return '-';
-        }
-
-        return explode('T', $value)[0] ?: $value;
     }
 }

app/Http/Controllers/MahasiswaController.php

@@ -2,455 +2,20 @@
 
 namespace App\Http\Controllers;
 
-use App\Exceptions\RagApiException;
-use Illuminate\Http\Client\ConnectionException;
-use Illuminate\Http\JsonResponse;
-use Illuminate\Http\RedirectResponse;
-use Illuminate\Http\Request;
-use Illuminate\Support\Str;
 use Inertia\Inertia;
 use Inertia\Response;
-use Symfony\Component\HttpFoundation\StreamedResponse;
 
 class MahasiswaController extends Controller
 {
-    private const AUTH_TOKEN_COOKIE = 'sevima_raghub_auth_token';
-
-    private const DIRECT_MESSAGES_SESSION_PREFIX = 'sevima_raghub_direct_messages';
-
-    public function index(Request $request): Response
-    {
-        $payload = $this->studentDashboardPayload($request);
-
-        return Inertia::render('mahasiswa', [
-            ...$payload,
-            'selectedCourseId' => $this->firstCourseId($payload['courses']),
-        ]);
-    }
-
-    public function storeSession(Request $request): RedirectResponse
+    public function index(): Response
     {
-        /** @var array{course_id: string, title: string} $payload */
-        $payload = $request->validate([
-            'course_id' => ['required', 'string'],
-            'title' => ['required', 'string'],
-        ]);
-
-        try {
-            $session = $this->createChatSession($payload, $this->authToken($request));
-        } catch (RagApiException|ConnectionException $exception) {
-            return back()
-                ->withErrors(['chat' => $exception->getMessage()])
-                ->withInput();
-        }
-
-        $sessionId = (string) ($session['uuid_id'] ?? '');
-
-        return to_route('mahasiswa.show', ['sessionId' => $sessionId])
-            ->with('initialQuestion', [
-                'content' => $payload['title'],
-                'courseId' => $payload['course_id'],
-            ]);
+        return Inertia::render('mahasiswa');
     }
 
-    public function show(Request $request, string $sessionId): Response
+    public function show(string $sessionId): Response
     {
-        $payload = $this->studentDashboardPayload($request);
-        $backendMessage = $payload['backendMessage'];
-        $currentSession = null;
-        $messages = [];
-        $token = $this->authToken($request);
-
-        try {
-            $currentSession = $this->getChatSession($sessionId, $token);
-        } catch (RagApiException|ConnectionException $exception) {
-            $backendMessage ??= $exception->getMessage() ?: null;
-        }
-
-        try {
-            $messages = $this->getChatHistory($sessionId, $token)['data'];
-        } catch (RagApiException|ConnectionException $exception) {
-            $backendMessage ??= $exception->getMessage() ?: null;
-        }
-
-        if ($this->isDirectChatMode()) {
-            $messages = [
-                ...$messages,
-                ...$this->directChatMessages($request, $sessionId),
-            ];
-        }
-
-        $initialQuestion = $request->session()->get('initialQuestion');
-
         return Inertia::render('mahasiswa-chat', [
-            ...$payload,
-            'backendMessage' => $backendMessage,
-            'currentSession' => $currentSession,
-            'initialQuestion' => is_array($initialQuestion) ? $initialQuestion : null,
-            'isDirectChatMode' => $this->isDirectChatMode(),
-            'isStreamChatMode' => $this->isStreamChatMode(),
-            'messages' => $messages,
-            'selectedCourseId' => is_string($currentSession['course_id'] ?? null)
-                ? $currentSession['course_id']
-                : $this->firstCourseId($payload['courses']),
             'sessionId' => $sessionId,
         ]);
     }
-
-    public function storeMessage(Request $request, string $sessionId): JsonResponse|RedirectResponse|StreamedResponse
-    {
-        /** @var array{content: string, course_id: string} $payload */
-        $payload = $request->validate([
-            'content' => ['required', 'string'],
-            'course_id' => ['required', 'string'],
-        ]);
-        $userMessage = $this->localUserMessage($payload['content']);
-
-        if ($this->isStreamChatMode() && $request->accepts('text/event-stream')) {
-            try {
-                $request->session()->save();
-
-                return $this->streamChatMessage(
-                    $sessionId,
-                    $payload['content'],
-                    $this->authToken($request),
-                );
-            } catch (RagApiException|ConnectionException $exception) {
-                if ($request->expectsJson() || $request->accepts('text/event-stream')) {
-                    return response()->json([
-                        'errors' => [
-                            'message' => [$exception->getMessage()],
-                        ],
-                        'message' => $exception->getMessage(),
-                    ], 422);
-                }
-
-                return back()
-                    ->withErrors(['message' => $exception->getMessage()])
-                    ->withInput();
-            }
-        }
-
-        try {
-            $assistantMessage = $this->sendConfiguredChatMessage(
-                $sessionId,
-                $payload['course_id'],
-                $payload['content'],
-                $this->authToken($request),
-            );
-        } catch (RagApiException|ConnectionException $exception) {
-            if ($request->expectsJson()) {
-                return response()->json([
-                    'errors' => [
-                        'message' => [$exception->getMessage()],
-                    ],
-                    'message' => $exception->getMessage(),
-                ], 422);
-            }
-
-            return back()
-                ->withErrors(['message' => $exception->getMessage()])
-                ->withInput();
-        }
-
-        if ($this->isDirectChatMode()) {
-            $this->appendDirectChatMessages($request, $sessionId, [
-                $userMessage,
-                $assistantMessage,
-            ]);
-        }
-
-        if ($request->expectsJson()) {
-            return response()->json([
-                'assistantMessage' => $assistantMessage,
-            ]);
-        }
-
-        return to_route('mahasiswa.show', ['sessionId' => $sessionId]);
-    }
-
-    public function destroySession(Request $request, string $sessionId): RedirectResponse
-    {
-        try {
-            $this->deleteChatSession($sessionId, $this->authToken($request));
-        } catch (RagApiException $exception) {
-            return back()->withErrors(['session' => $exception->getMessage()]);
-        }
-
-        $this->clearDirectChatMessages($request, $sessionId);
-
-        if ($request->string('active_session_id')->toString() === $sessionId) {
-            return to_route('mahasiswa');
-        }
-
-        return back();
-    }
-
-    /**
-     * @return array{backendMessage: ?string, chatSessions: array<int, array<string, mixed>>, courses: array<int, array<string, mixed>>}
-     */
-    private function studentDashboardPayload(Request $request): array
-    {
-        $backendMessage = null;
-        $courses = [];
-        $chatSessions = [];
-        $token = $this->authToken($request);
-
-        try {
-            $courses = $this->listCourses(limit: 100, token: $token)['data'];
-        } catch (RagApiException|ConnectionException $exception) {
-            $backendMessage = $exception->getMessage() ?: null;
-        }
-
-        if ($token !== null) {
-            try {
-                $chatSessions = $this->listChatSessions(limit: 20, token: $token)['data'];
-            } catch (RagApiException|ConnectionException $exception) {
-                $backendMessage ??= $exception->getMessage() ?: null;
-            }
-        }
-
-        return [
-            'backendMessage' => $backendMessage,
-            'chatSessions' => $chatSessions,
-            'courses' => $courses,
-        ];
-    }
-
-    /**
-     * @return array{data: array<int, array<string, mixed>>, total?: int, page?: int, limit?: int}
-     */
-    private function listCourses(int $page = 1, int $limit = 100, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/courses', [
-            'limit' => $limit,
-            'page' => $page,
-        ]);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array{data: array<int, array<string, mixed>>, total?: int, page?: int, limit?: int} */
-        return $response->json();
-    }
-
-    /**
-     * @return array{data: array<int, array<string, mixed>>, pagination?: array<string, mixed>}
-     */
-    private function listChatSessions(int $page = 1, int $limit = 20, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/chats/sessions', [
-            'limit' => $limit,
-            'page' => $page,
-        ]);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array{data: array<int, array<string, mixed>>, pagination?: array<string, mixed>} */
-        return $response->json();
-    }
-
-    /**
-     * @param  array{course_id: string, title: string}  $payload
-     * @return array<string, mixed>
-     */
-    private function createChatSession(array $payload, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)
-            ->asJson()
-            ->post('/chats/sessions', $payload);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @return array<string, mixed>
-     */
-    private function getChatSession(string $sessionId, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/chats/sessions/'.$this->encodePathSegment($sessionId));
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    /**
-     * @return array{data: array<int, array<string, mixed>>}
-     */
-    private function getChatHistory(string $sessionId, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)->get('/chats/sessions/'.$this->encodePathSegment($sessionId).'/messages');
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array{data: array<int, array<string, mixed>>} */
-        return $response->json();
-    }
-
-    private function deleteChatSession(string $sessionId, ?string $token = null): void
-    {
-        $response = $this->ragRequest($token)->delete('/chats/sessions/'.$this->encodePathSegment($sessionId));
-
-        $this->throwIfRagFailed($response);
-    }
-
-    /**
-     * @return array<string, mixed>
-     */
-    private function sendConfiguredChatMessage(string $sessionId, string $courseId, string $content, ?string $token = null): array
-    {
-        if ($this->isDirectChatMode()) {
-            return $this->queryAiDirect($courseId, $content, $token);
-        }
-
-        return $this->sendRestChatMessage($sessionId, $content, $token);
-    }
-
-    /**
-     * @return array<string, mixed>
-     */
-    private function sendRestChatMessage(string $sessionId, string $content, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)
-            ->asJson()
-            ->post('/chats/sessions/'.$this->encodePathSegment($sessionId).'/messages', [
-                'content' => $content,
-            ]);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array<string, mixed> */
-        return $response->json();
-    }
-
-    private function streamChatMessage(string $sessionId, string $content, ?string $token = null): StreamedResponse
-    {
-        $response = $this->ragStreamRequest($token)
-            ->asJson()
-            ->post('/chats/sessions/'.$this->encodePathSegment($sessionId).'/stream', [
-                'content' => $content,
-            ]);
-
-        $this->throwIfRagFailed($response);
-
-        $stream = $response->toPsrResponse()->getBody();
-
-        return response()->stream(function () use ($stream): void {
-            @ini_set('zlib.output_compression', '0');
-
-            while (! $stream->eof()) {
-                $chunk = $stream->read(1);
-
-                if ($chunk === '') {
-                    usleep(10_000);
-
-                    continue;
-                }
-
-                echo $chunk;
-
-                if (ob_get_level() > 0) {
-                    ob_flush();
-                }
-
-                flush();
-            }
-        }, 200, [
-            'Cache-Control' => 'no-cache, no-transform',
-            'Content-Type' => 'text/event-stream; charset=utf-8',
-            'X-Accel-Buffering' => 'no',
-        ]);
-    }
-
-    /**
-     * @return array{uuid_id: string, role: string, content: string, sources: array<int, mixed>, created_at: string}
-     */
-    private function queryAiDirect(string $courseId, string $content, ?string $token = null): array
-    {
-        $response = $this->ragRequest($token)
-            ->asJson()
-            ->post('/ai/query', [
-                'course_id' => $courseId,
-                'prompt' => $content,
-            ]);
-
-        $this->throwIfRagFailed($response);
-
-        /** @var array{message_id: string, role?: string, content: string, sources?: array<int, mixed>, created_at: string} $payload */
-        $payload = $response->json();
-
-        return [
-            'content' => $payload['content'],
-            'created_at' => $payload['created_at'],
-            'role' => $payload['role'] ?? 'assistant',
-            'sources' => $payload['sources'] ?? [],
-            'uuid_id' => $payload['message_id'],
-        ];
-    }
-
-    private function authToken(Request $request): ?string
-    {
-        $token = $request->cookie(self::AUTH_TOKEN_COOKIE);
-
-        return is_string($token) && $token !== '' ? $token : null;
-    }
-
-    /**
-     * @param  array<int, array<string, mixed>>  $courses
-     */
-    private function firstCourseId(array $courses): ?string
-    {
-        $courseId = $courses[0]['id'] ?? null;
-
-        return $courseId === null ? null : (string) $courseId;
-    }
-
-    /**
-     * @return array{uuid_id: string, role: string, content: string, sources: array<int, mixed>, created_at: string}
-     */
-    private function localUserMessage(string $content): array
-    {
-        return [
-            'content' => $content,
-            'created_at' => now()->toISOString(),
-            'role' => 'user',
-            'sources' => [],
-            'uuid_id' => 'local-'.Str::uuid(),
-        ];
-    }
-
-    /**
-     * @return array<int, array<string, mixed>>
-     */
-    private function directChatMessages(Request $request, string $sessionId): array
-    {
-        $messages = $request->session()->get($this->directMessagesKey($sessionId), []);
-
-        return is_array($messages) ? $messages : [];
-    }
-
-    /**
-     * @param  array<int, array<string, mixed>>  $messages
-     */
-    private function appendDirectChatMessages(Request $request, string $sessionId, array $messages): void
-    {
-        $request->session()->put($this->directMessagesKey($sessionId), [
-            ...$this->directChatMessages($request, $sessionId),
-            ...$messages,
-        ]);
-    }
-
-    private function clearDirectChatMessages(Request $request, string $sessionId): void
-    {
-        $request->session()->forget($this->directMessagesKey($sessionId));
-    }
-
-    private function directMessagesKey(string $sessionId): string
-    {
-        return self::DIRECT_MESSAGES_SESSION_PREFIX.'.'.$sessionId;
-    }
 }

resources/js/components/admin/admin-api-key-card.tsx

@@ -1,8 +1,7 @@
-import { useForm } from '@inertiajs/react';
 import { Copy, KeyRound } from 'lucide-react';
+import { useState } from 'react';
 import { toast } from 'sonner';
 
-import { generateApiKey } from '@/actions/App/Http/Controllers/AdminController';
 import { ConfigError } from '@/components/admin/admin-form-parts';
 import { Button } from '@/components/ui/button';
 import {
@@ -15,18 +14,29 @@ import {
 import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import { Spinner } from '@/components/ui/spinner';
-import { readError } from '@/lib/admin';
+import { generateApiKey } from '@/lib/rag-client';
 import type { GeneratedApiKey } from '@/types/admin';
 
-export function AdminApiKeyCard({
-    generatedApiKey,
-}: {
-    generatedApiKey?: GeneratedApiKey | null;
-}) {
-    const apiKeyForm = useForm({});
+export function AdminApiKeyCard() {
+    const [generatedApiKey, setGeneratedApiKey] =
+        useState<GeneratedApiKey | null>(null);
+    const [isLoading, setIsLoading] = useState(false);
+    const [error, setError] = useState<string | undefined>();
 
-    function handleGenerateApiKey(): void {
-        apiKeyForm.post(generateApiKey.url(), { preserveScroll: true });
+    async function handleGenerateApiKey(): Promise<void> {
+        setIsLoading(true);
+        setError(undefined);
+
+        try {
+            const result = await generateApiKey();
+            setGeneratedApiKey(result);
+        } catch (e) {
+            setError(
+                e instanceof Error ? e.message : 'Gagal membuat API key.',
+            );
+        } finally {
+            setIsLoading(false);
+        }
     }
 
     function handleCopyApiKey(): void {
@@ -42,7 +52,7 @@ export function AdminApiKeyCard({
         <Card className="border-(--lecturer-border) bg-(--lecturer-surface)">
             <CardHeader>
                 <CardTitle className="flex items-center gap-2">
-                    <KeyRound className="size-5 text-[var(--lecturer-primary)]" />
+                    <KeyRound className="size-5 text-(--lecturer-primary)" />
                     API Key Iframe
                 </CardTitle>
                 <CardDescription>
@@ -51,11 +61,13 @@ export function AdminApiKeyCard({
             </CardHeader>
             <CardContent className="grid gap-4">
                 <Button
-                    disabled={apiKeyForm.processing}
-                    onClick={handleGenerateApiKey}
+                    disabled={isLoading}
+                    onClick={() => {
+                        void handleGenerateApiKey();
+                    }}
                     type="button"
                 >
-                    {apiKeyForm.processing ? (
+                    {isLoading ? (
                         <Spinner className="size-4" />
                     ) : (
                         <KeyRound className="size-4" />
@@ -63,7 +75,7 @@ export function AdminApiKeyCard({
                     Generate API Key
                 </Button>
 
-                <ConfigError message={readError(apiKeyForm.errors, 'apiKey')} />
+                <ConfigError message={error} />
 
                 {generatedApiKey ? (
                     <div className="grid gap-3 rounded-xl border border-(--lecturer-border) bg-(--lecturer-surface) p-4">
@@ -87,6 +99,3 @@ export function AdminApiKeyCard({
         </Card>
     );
 }
-
-
-

resources/js/components/admin/admin-form-parts.tsx

@@ -1,9 +1,7 @@
-import type { InertiaFormProps } from '@inertiajs/react';
 import type { ReactNode } from 'react';
 
 import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
-import type { RetrievalForm } from '@/types/admin';
 
 export function ConfigError({ message }: { message?: string }) {
     if (!message) {
@@ -29,15 +27,15 @@ export function Field({
 }
 
 export function RetrievalNumberField({
-    form,
     label,
-    name,
+    onChange,
     step = '1',
+    value,
 }: {
-    form: InertiaFormProps<RetrievalForm>;
     label: string;
-    name: keyof Omit<RetrievalForm, 'enable_reranker' | 'reranker_model'>;
+    onChange: (value: string) => void;
     step?: string;
+    value: string;
 }) {
     return (
         <Field label={label}>
@@ -45,12 +43,9 @@ export function RetrievalNumberField({
                 min="0"
                 step={step}
                 type="number"
-                value={form.data[name]}
-                onChange={(event) => form.setData(name, event.target.value)}
+                value={value}
+                onChange={(event) => onChange(event.target.value)}
             />
         </Field>
     );
 }
-
-
-

resources/js/components/admin/admin-llm-form.tsx

@@ -1,91 +1,127 @@
-import { useForm } from '@inertiajs/react';
 import { Save } from 'lucide-react';
 import type { FormEvent } from 'react';
+import { useState } from 'react';
 
-import { updateLlmConfig } from '@/actions/App/Http/Controllers/AdminController';
 import { ConfigError, Field } from '@/components/admin/admin-form-parts';
 import { Button } from '@/components/ui/button';
 import { Card, CardContent } from '@/components/ui/card';
 import { Input } from '@/components/ui/input';
 import { Spinner } from '@/components/ui/spinner';
-import { readError, stringValue } from '@/lib/admin';
+import { stringValue } from '@/lib/admin';
+import { patchLlmConfig } from '@/lib/rag-client';
 import type { LlmConfig, LlmForm } from '@/types/admin';
 
 export function AdminLlmForm({ llm }: { llm?: LlmConfig | null }) {
-    const llmConfig = llm ?? {};
-    const llmForm = useForm<LlmForm>({
-        api_key_env: stringValue(llmConfig.api_key_env),
-        base_url: stringValue(llmConfig.base_url),
-        max_tokens: stringValue(llmConfig.max_tokens),
-        model: stringValue(llmConfig.model),
-        provider: stringValue(llmConfig.provider),
-        reasoning_effort: stringValue(llmConfig.reasoning_effort),
-        request_timeout: stringValue(llmConfig.request_timeout),
-        system_prompt: stringValue(llmConfig.system_prompt),
-        temperature: stringValue(llmConfig.temperature),
+    const cfg = llm ?? {};
+    const [formData, setFormData] = useState<LlmForm>({
+        api_key_env: stringValue(cfg.api_key_env),
+        base_url: stringValue(cfg.base_url),
+        max_tokens: stringValue(cfg.max_tokens),
+        model: stringValue(cfg.model),
+        provider: stringValue(cfg.provider),
+        reasoning_effort: stringValue(cfg.reasoning_effort),
+        request_timeout: stringValue(cfg.request_timeout),
+        system_prompt: stringValue(cfg.system_prompt),
+        temperature: stringValue(cfg.temperature),
     });
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const [error, setError] = useState<string | undefined>();
 
-    function handleLlmSubmit(event: FormEvent<HTMLFormElement>): void {
+    function setField<K extends keyof LlmForm>(key: K, value: LlmForm[K]): void {
+        setFormData((prev) => ({ ...prev, [key]: value }));
+    }
+
+    async function handleSubmit(
+        event: FormEvent<HTMLFormElement>,
+    ): Promise<void> {
         event.preventDefault();
-        llmForm.patch(updateLlmConfig.url(), { preserveScroll: true });
+        setIsSubmitting(true);
+        setError(undefined);
+
+        try {
+            const payload: Record<string, unknown> = {};
+            if (formData.api_key_env) payload.api_key_env = formData.api_key_env;
+            if (formData.base_url) payload.base_url = formData.base_url;
+            if (formData.max_tokens) payload.max_tokens = parseInt(formData.max_tokens, 10);
+            if (formData.model) payload.model = formData.model;
+            if (formData.provider) payload.provider = formData.provider;
+            if (formData.reasoning_effort) payload.reasoning_effort = formData.reasoning_effort;
+            if (formData.request_timeout) payload.request_timeout = parseInt(formData.request_timeout, 10);
+            if (formData.system_prompt) payload.system_prompt = formData.system_prompt;
+            if (formData.temperature) payload.temperature = parseFloat(formData.temperature);
+
+            const result = await patchLlmConfig(payload);
+            setFormData({
+                api_key_env: stringValue(result.api_key_env),
+                base_url: stringValue(result.base_url),
+                max_tokens: stringValue(result.max_tokens),
+                model: stringValue(result.model),
+                provider: stringValue(result.provider),
+                reasoning_effort: stringValue(result.reasoning_effort),
+                request_timeout: stringValue(result.request_timeout),
+                system_prompt: stringValue(result.system_prompt),
+                temperature: stringValue(result.temperature),
+            });
+        } catch (e) {
+            setError(
+                e instanceof Error
+                    ? e.message
+                    : 'Gagal menyimpan konfigurasi LLM.',
+            );
+        } finally {
+            setIsSubmitting(false);
+        }
     }
 
     return (
         <Card className="border-(--lecturer-border) bg-(--lecturer-surface)">
             <CardContent className="pt-6">
-                <form className="grid gap-4" onSubmit={handleLlmSubmit}>
-                    <ConfigError message={readError(llmForm.errors, 'llm')} />
+                <form
+                    className="grid gap-4"
+                    onSubmit={(e) => {
+                        void handleSubmit(e);
+                    }}
+                >
+                    <ConfigError message={error} />
 
                     <div className="grid gap-3 md:grid-cols-2">
                         <Field label="Provider">
                             <Input
-                                value={llmForm.data.provider}
+                                value={formData.provider}
                                 onChange={(event) =>
-                                    llmForm.setData(
-                                        'provider',
-                                        event.target.value,
-                                    )
+                                    setField('provider', event.target.value)
                                 }
                             />
                         </Field>
                         <Field label="Model">
                             <Input
-                                value={llmForm.data.model}
+                                value={formData.model}
                                 onChange={(event) =>
-                                    llmForm.setData(
-                                        'model',
-                                        event.target.value,
-                                    )
+                                    setField('model', event.target.value)
                                 }
                             />
                         </Field>
                         <Field label="Base URL">
                             <Input
-                                value={llmForm.data.base_url}
+                                value={formData.base_url}
                                 onChange={(event) =>
-                                    llmForm.setData(
-                                        'base_url',
-                                        event.target.value,
-                                    )
+                                    setField('base_url', event.target.value)
                                 }
                             />
                         </Field>
                         <Field label="API Key Env">
                             <Input
-                                value={llmForm.data.api_key_env}
+                                value={formData.api_key_env}
                                 onChange={(event) =>
-                                    llmForm.setData(
-                                        'api_key_env',
-                                        event.target.value,
-                                    )
+                                    setField('api_key_env', event.target.value)
                                 }
                             />
                         </Field>
                         <Field label="Reasoning Effort">
                             <Input
-                                value={llmForm.data.reasoning_effort}
+                                value={formData.reasoning_effort}
                                 onChange={(event) =>
-                                    llmForm.setData(
+                                    setField(
                                         'reasoning_effort',
                                         event.target.value,
                                     )
@@ -97,12 +133,9 @@ export function AdminLlmForm({ llm }: { llm?: LlmConfig | null }) {
                                 min="0"
                                 step="0.01"
                                 type="number"
-                                value={llmForm.data.temperature}
+                                value={formData.temperature}
                                 onChange={(event) =>
-                                    llmForm.setData(
-                                        'temperature',
-                                        event.target.value,
-                                    )
+                                    setField('temperature', event.target.value)
                                 }
                             />
                         </Field>
@@ -110,12 +143,9 @@ export function AdminLlmForm({ llm }: { llm?: LlmConfig | null }) {
                             <Input
                                 min="1"
                                 type="number"
-                                value={llmForm.data.max_tokens}
+                                value={formData.max_tokens}
                                 onChange={(event) =>
-                                    llmForm.setData(
-                                        'max_tokens',
-                                        event.target.value,
-                                    )
+                                    setField('max_tokens', event.target.value)
                                 }
                             />
                         </Field>
@@ -123,9 +153,9 @@ export function AdminLlmForm({ llm }: { llm?: LlmConfig | null }) {
                             <Input
                                 min="1"
                                 type="number"
-                                value={llmForm.data.request_timeout}
+                                value={formData.request_timeout}
                                 onChange={(event) =>
-                                    llmForm.setData(
+                                    setField(
                                         'request_timeout',
                                         event.target.value,
                                     )
@@ -137,19 +167,16 @@ export function AdminLlmForm({ llm }: { llm?: LlmConfig | null }) {
                     <Field label="System Prompt">
                         <textarea
                             className="border-input ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring min-h-36 w-full rounded-md border px-3 py-2 text-sm focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none"
-                            value={llmForm.data.system_prompt}
+                            value={formData.system_prompt}
                             onChange={(event) =>
-                                llmForm.setData(
-                                    'system_prompt',
-                                    event.target.value,
-                                )
+                                setField('system_prompt', event.target.value)
                             }
                         />
                     </Field>
 
                     <div className="flex justify-end">
-                        <Button disabled={llmForm.processing} type="submit">
-                            {llmForm.processing ? (
+                        <Button disabled={isSubmitting} type="submit">
+                            {isSubmitting ? (
                                 <Spinner className="size-4" />
                             ) : (
                                 <Save className="size-4" />
@@ -162,6 +189,3 @@ export function AdminLlmForm({ llm }: { llm?: LlmConfig | null }) {
         </Card>
     );
 }
-
-
-

resources/js/components/admin/admin-user-management.tsx

@@ -1,15 +1,7 @@
-import { router, useForm } from '@inertiajs/react';
-import type { InertiaFormProps } from '@inertiajs/react';
 import { Search, Trash2, UserPlus } from 'lucide-react';
 import type { FormEvent } from 'react';
 import { useMemo, useState } from 'react';
 
-import {
-    destroyUser,
-    index as adminIndex,
-    storeUser,
-    updateUser,
-} from '@/actions/App/Http/Controllers/AdminController';
 import { ConfigError, Field } from '@/components/admin/admin-form-parts';
 import { Badge } from '@/components/ui/badge';
 import { Button } from '@/components/ui/button';
@@ -43,11 +35,16 @@ import {
     emptyUserForm,
     formatDate,
     isUserActive,
-    readError,
     roleLabel,
     stringValue,
     userToForm,
 } from '@/lib/admin';
+import {
+    createAdminUser,
+    deleteAdminUser,
+    listAdminUsers,
+    updateAdminUser,
+} from '@/lib/rag-client';
 import type {
     AdminRole,
     AdminUser,
@@ -55,22 +52,48 @@ import type {
     UserForm,
 } from '@/types/admin';
 
-export function AdminUserCreateCard() {
-    const userForm = useForm<UserForm>(emptyUserForm);
+export function AdminUserCreateCard({
+    onCreated,
+}: {
+    onCreated?: (user: AdminUser) => void;
+}) {
+    const [formData, setFormData] = useState<UserForm>(emptyUserForm);
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const [error, setError] = useState<string | undefined>();
+
+    function setField<K extends keyof UserForm>(
+        key: K,
+        value: UserForm[K],
+    ): void {
+        setFormData((prev) => ({ ...prev, [key]: value }));
+    }
 
-    function handleStoreUser(event: FormEvent<HTMLFormElement>): void {
+    async function handleSubmit(
+        event: FormEvent<HTMLFormElement>,
+    ): Promise<void> {
         event.preventDefault();
-        userForm.post(storeUser.url(), {
-            onSuccess: () => userForm.reset(),
-            preserveScroll: true,
-        });
+        setIsSubmitting(true);
+        setError(undefined);
+
+        try {
+            const payload = buildUserPayload(formData);
+            const created = await createAdminUser(payload);
+            setFormData(emptyUserForm);
+            onCreated?.(created);
+        } catch (e) {
+            setError(
+                e instanceof Error ? e.message : 'Gagal membuat user.',
+            );
+        } finally {
+            setIsSubmitting(false);
+        }
     }
 
     return (
         <Card className="border-(--lecturer-border) bg-(--lecturer-surface)">
             <CardHeader>
                 <CardTitle className="flex items-center gap-2">
-                    <UserPlus className="size-5 text-[var(--lecturer-primary)]" />
+                    <UserPlus className="size-5 text-(--lecturer-primary)" />
                     Tambah User
                 </CardTitle>
                 <CardDescription>
@@ -79,9 +102,14 @@ export function AdminUserCreateCard() {
             </CardHeader>
             <CardContent>
                 <UserFormFields
-                    form={userForm}
-                    onSubmit={handleStoreUser}
+                    data={formData}
+                    error={error}
+                    isSubmitting={isSubmitting}
+                    setField={setField}
                     submitLabel="Buat User"
+                    onSubmit={(e) => {
+                        void handleSubmit(e);
+                    }}
                 />
             </CardContent>
         </Card>
@@ -89,26 +117,22 @@ export function AdminUserCreateCard() {
 }
 
 export function AdminUserManagement({
-    userFilters,
-    users = [],
+    users: initialUsers = [],
 }: {
-    userFilters?: Record<string, unknown>;
     users?: AdminUser[];
 }) {
+    const [users, setUsers] = useState<AdminUser[]>(initialUsers);
     const [editingUser, setEditingUser] = useState<AdminUser | null>(null);
     const [deletingUser, setDeletingUser] = useState<AdminUser | null>(null);
-
-    const editUserForm = useForm<UserForm>(emptyUserForm);
-    const deleteUserForm = useForm({});
-    const filterForm = useForm<UserFilterForm>({
-        email: stringValue(userFilters?.email),
-        name: stringValue(userFilters?.name),
-        role:
-            userFilters?.role === 'student' ||
-            userFilters?.role === 'lecturer' ||
-            userFilters?.role === 'admin'
-                ? userFilters.role
-                : 'all',
+    const [editFormData, setEditFormData] = useState<UserForm>(emptyUserForm);
+    const [isEditing, setIsEditing] = useState(false);
+    const [isDeleting, setIsDeleting] = useState(false);
+    const [isFiltering, setIsFiltering] = useState(false);
+    const [editError, setEditError] = useState<string | undefined>();
+    const [filterForm, setFilterForm] = useState<UserFilterForm>({
+        email: '',
+        name: '',
+        role: 'all',
     });
 
     const userStats = useMemo(() => {
@@ -120,42 +144,80 @@ export function AdminUserManagement({
         };
     }, [users]);
 
-    function handleUserFilter(event: FormEvent<HTMLFormElement>): void {
-        event.preventDefault();
-        router.get(adminIndex.url(), buildFilterQuery(filterForm.data), {
-            preserveScroll: true,
-            preserveState: true,
-        });
+    function setEditField<K extends keyof UserForm>(
+        key: K,
+        value: UserForm[K],
+    ): void {
+        setEditFormData((prev) => ({ ...prev, [key]: value }));
     }
 
     function openEditUserDialog(user: AdminUser): void {
         setEditingUser(user);
-        editUserForm.setData(userToForm(user));
-        editUserForm.clearErrors();
+        setEditFormData(userToForm(user));
+        setEditError(undefined);
+    }
+
+    async function handleUserFilter(
+        event: FormEvent<HTMLFormElement>,
+    ): Promise<void> {
+        event.preventDefault();
+        setIsFiltering(true);
+
+        try {
+            const query = buildFilterQuery(filterForm);
+            const result = await listAdminUsers(query);
+            setUsers(result.founds ?? []);
+        } catch {
+            // silently keep current list on filter error
+        } finally {
+            setIsFiltering(false);
+        }
     }
 
-    function handleUpdateUser(event: FormEvent<HTMLFormElement>): void {
+    async function handleUpdateUser(
+        event: FormEvent<HTMLFormElement>,
+    ): Promise<void> {
         event.preventDefault();
 
         if (!editingUser) {
             return;
         }
 
-        editUserForm.patch(updateUser.url(editingUser.id), {
-            onSuccess: () => setEditingUser(null),
-            preserveScroll: true,
-        });
+        setIsEditing(true);
+        setEditError(undefined);
+
+        try {
+            const payload = buildUserPayload(editFormData);
+            const updated = await updateAdminUser(editingUser.id, payload);
+            setUsers((prev) =>
+                prev.map((u) => (u.id === updated.id ? updated : u)),
+            );
+            setEditingUser(null);
+        } catch (e) {
+            setEditError(
+                e instanceof Error ? e.message : 'Gagal memperbarui user.',
+            );
+        } finally {
+            setIsEditing(false);
+        }
     }
 
-    function handleDestroyUser(): void {
+    async function handleDestroyUser(): Promise<void> {
         if (!deletingUser) {
             return;
         }
 
-        deleteUserForm.delete(destroyUser.url(deletingUser.id), {
-            onSuccess: () => setDeletingUser(null),
-            preserveScroll: true,
-        });
+        setIsDeleting(true);
+
+        try {
+            await deleteAdminUser(deletingUser.id);
+            setUsers((prev) => prev.filter((u) => u.id !== deletingUser.id));
+            setDeletingUser(null);
+        } catch {
+            // keep dialog open on error
+        } finally {
+            setIsDeleting(false);
+        }
     }
 
     return (
@@ -173,35 +235,37 @@ export function AdminUserManagement({
 
                         <form
                             className="grid gap-2 sm:grid-cols-[1fr_1fr_160px_auto]"
-                            onSubmit={handleUserFilter}
+                            onSubmit={(e) => {
+                                void handleUserFilter(e);
+                            }}
                         >
                             <Input
                                 placeholder="Cari nama..."
-                                value={filterForm.data.name}
+                                value={filterForm.name}
                                 onChange={(event) =>
-                                    filterForm.setData(
-                                        'name',
-                                        event.target.value,
-                                    )
+                                    setFilterForm((prev) => ({
+                                        ...prev,
+                                        name: event.target.value,
+                                    }))
                                 }
                             />
                             <Input
                                 placeholder="Cari email..."
-                                value={filterForm.data.email}
+                                value={filterForm.email}
                                 onChange={(event) =>
-                                    filterForm.setData(
-                                        'email',
-                                        event.target.value,
-                                    )
+                                    setFilterForm((prev) => ({
+                                        ...prev,
+                                        email: event.target.value,
+                                    }))
                                 }
                             />
                             <Select
-                                value={filterForm.data.role}
+                                value={filterForm.role}
                                 onValueChange={(value) =>
-                                    filterForm.setData(
-                                        'role',
-                                        value as UserFilterForm['role'],
-                                    )
+                                    setFilterForm((prev) => ({
+                                        ...prev,
+                                        role: value as UserFilterForm['role'],
+                                    }))
                                 }
                             >
                                 <SelectTrigger className="w-full">
@@ -220,8 +284,8 @@ export function AdminUserManagement({
                                     <SelectItem value="admin">Admin</SelectItem>
                                 </SelectContent>
                             </Select>
-                            <Button type="submit">
-                                {filterForm.processing ? (
+                            <Button disabled={isFiltering} type="submit">
+                                {isFiltering ? (
                                     <Spinner className="size-4" />
                                 ) : (
                                     <Search className="size-4" />
@@ -234,7 +298,7 @@ export function AdminUserManagement({
                 <CardContent>
                     <div className="overflow-hidden rounded-xl border border-(--lecturer-border)">
                         <div className="overflow-x-auto">
-                            <table className="w-full min-w-[760px] text-sm">
+                            <table className="w-full min-w-190 text-sm">
                                 <thead className="bg-muted/50 text-left text-muted-foreground">
                                     <tr>
                                         <th className="px-4 py-3">Nama</th>
@@ -272,7 +336,7 @@ export function AdminUserManagement({
                                                 <Badge
                                                     className={
                                                         isUserActive(user)
-                                                            ? 'bg-[var(--lecturer-primary-soft)] text-[var(--lecturer-primary)]'
+                                                            ? 'bg-(--lecturer-primary-soft) text-(--lecturer-primary)'
                                                             : ''
                                                     }
                                                     variant={
@@ -357,15 +421,22 @@ export function AdminUserManagement({
                     </DialogHeader>
 
                     <UserFormFields
-                        form={editUserForm}
-                        onSubmit={handleUpdateUser}
+                        data={editFormData}
+                        error={editError}
+                        isSubmitting={isEditing}
+                        setField={setEditField}
                         submitLabel="Simpan User"
+                        onSubmit={(e) => {
+                            void handleUpdateUser(e);
+                        }}
                     />
                 </DialogContent>
             </Dialog>
 
             <Dialog
-                onOpenChange={(open) => setDeletingUser(open ? deletingUser : null)}
+                onOpenChange={(open) =>
+                    setDeletingUser(open ? deletingUser : null)
+                }
                 open={deletingUser !== null}
             >
                 <DialogContent>
@@ -386,11 +457,13 @@ export function AdminUserManagement({
                         </Button>
                         <Button
                             className="bg-destructive text-white hover:bg-destructive/90"
-                            disabled={deleteUserForm.processing}
-                            onClick={handleDestroyUser}
+                            disabled={isDeleting}
+                            onClick={() => {
+                                void handleDestroyUser();
+                            }}
                             type="button"
                         >
-                            {deleteUserForm.processing ? (
+                            {isDeleting ? (
                                 <Spinner className="size-4" />
                             ) : null}
                             Hapus
@@ -402,61 +475,79 @@ export function AdminUserManagement({
     );
 }
 
+function buildUserPayload(form: UserForm): Record<string, unknown> {
+    const payload: Record<string, unknown> = {
+        is_active: form.is_active,
+        is_superuser: form.is_superuser,
+        role: form.role,
+    };
+    if (form.name) payload.name = form.name;
+    if (form.email) payload.email = form.email;
+    if (form.identity_number) payload.identity_number = form.identity_number;
+    if (form.phone) payload.phone = form.phone;
+    if (form.user_token) payload.user_token = form.user_token;
+
+    return payload;
+}
+
 function UserFormFields({
-    form,
+    data,
+    error,
+    isSubmitting,
     onSubmit,
+    setField,
     submitLabel,
 }: {
-    form: InertiaFormProps<UserForm>;
+    data: UserForm;
+    error?: string;
+    isSubmitting: boolean;
     onSubmit: (event: FormEvent<HTMLFormElement>) => void;
+    setField: <K extends keyof UserForm>(key: K, value: UserForm[K]) => void;
     submitLabel: string;
 }) {
     return (
         <form className="grid gap-4" onSubmit={onSubmit}>
-            <ConfigError message={readError(form.errors, 'user')} />
+            <ConfigError message={error} />
 
             <div className="grid gap-3 md:grid-cols-2">
                 <Field label="Nama">
                     <Input
-                        value={form.data.name}
+                        value={data.name}
                         onChange={(event) =>
-                            form.setData('name', event.target.value)
+                            setField('name', event.target.value)
                         }
                     />
                 </Field>
                 <Field label="Email">
                     <Input
                         type="email"
-                        value={form.data.email}
+                        value={data.email}
                         onChange={(event) =>
-                            form.setData('email', event.target.value)
+                            setField('email', event.target.value)
                         }
                     />
                 </Field>
                 <Field label="Nomor Identitas">
                     <Input
-                        value={form.data.identity_number}
+                        value={data.identity_number}
                         onChange={(event) =>
-                            form.setData(
-                                'identity_number',
-                                event.target.value,
-                            )
+                            setField('identity_number', event.target.value)
                         }
                     />
                 </Field>
                 <Field label="Telepon">
                     <Input
-                        value={form.data.phone}
+                        value={data.phone}
                         onChange={(event) =>
-                            form.setData('phone', event.target.value)
+                            setField('phone', event.target.value)
                         }
                     />
                 </Field>
                 <Field label="Role">
                     <Select
-                        value={form.data.role}
+                        value={data.role}
                         onValueChange={(value) =>
-                            form.setData('role', value as AdminRole)
+                            setField('role', value as AdminRole)
                         }
                     >
                         <SelectTrigger className="w-full">
@@ -471,9 +562,9 @@ function UserFormFields({
                 </Field>
                 <Field label="User Token">
                     <Input
-                        value={form.data.user_token}
+                        value={data.user_token}
                         onChange={(event) =>
-                            form.setData('user_token', event.target.value)
+                            setField('user_token', event.target.value)
                         }
                     />
                 </Field>
@@ -482,18 +573,18 @@ function UserFormFields({
             <div className="grid gap-3 sm:grid-cols-2">
                 <label className="flex items-center gap-3 rounded-lg border border-(--lecturer-border) p-3 text-sm">
                     <Checkbox
-                        checked={form.data.is_active}
+                        checked={data.is_active}
                         onCheckedChange={(value) =>
-                            form.setData('is_active', value === true)
+                            setField('is_active', value === true)
                         }
                     />
                     User aktif
                 </label>
                 <label className="flex items-center gap-3 rounded-lg border border-(--lecturer-border) p-3 text-sm">
                     <Checkbox
-                        checked={form.data.is_superuser}
+                        checked={data.is_superuser}
                         onCheckedChange={(value) =>
-                            form.setData('is_superuser', value === true)
+                            setField('is_superuser', value === true)
                         }
                     />
                     Superuser
@@ -501,8 +592,8 @@ function UserFormFields({
             </div>
 
             <div className="flex justify-end">
-                <Button disabled={form.processing} type="submit">
-                    {form.processing ? <Spinner className="size-4" /> : null}
+                <Button disabled={isSubmitting} type="submit">
+                    {isSubmitting ? <Spinner className="size-4" /> : null}
                     {submitLabel}
                 </Button>
             </div>
@@ -510,5 +601,3 @@ function UserFormFields({
     );
 }
 
-
-

resources/js/components/admin/admin-vector-retrieval-forms.tsx

@@ -1,11 +1,7 @@
-import { useForm } from '@inertiajs/react';
 import { Save } from 'lucide-react';
 import type { FormEvent } from 'react';
+import { useState } from 'react';
 
-import {
-    updateRetrievalConfig,
-    updateVectorDbConfig,
-} from '@/actions/App/Http/Controllers/AdminController';
 import {
     ConfigError,
     Field,
@@ -16,7 +12,8 @@ import { Card, CardContent } from '@/components/ui/card';
 import { Checkbox } from '@/components/ui/checkbox';
 import { Input } from '@/components/ui/input';
 import { Spinner } from '@/components/ui/spinner';
-import { readError, stringValue } from '@/lib/admin';
+import { stringValue } from '@/lib/admin';
+import { patchRetrievalConfig, patchVectorDbConfig } from '@/lib/rag-client';
 import type {
     RetrievalConfig,
     RetrievalForm,
@@ -29,36 +26,72 @@ export function AdminVectorDbForm({
 }: {
     vectorDb?: VectorDbConfig | null;
 }) {
-    const vectorDbConfig = vectorDb ?? {};
-
-    const vectorDbForm = useForm<VectorDbForm>({
-        chunk_overlap: stringValue(vectorDbConfig.chunk_overlap),
-        chunk_size: stringValue(vectorDbConfig.chunk_size),
-        embedding_model: stringValue(vectorDbConfig.embedding_model),
-        persist_path: stringValue(vectorDbConfig.persist_path),
+    const cfg = vectorDb ?? {};
+    const [formData, setFormData] = useState<VectorDbForm>({
+        chunk_overlap: stringValue(cfg.chunk_overlap),
+        chunk_size: stringValue(cfg.chunk_size),
+        embedding_model: stringValue(cfg.embedding_model),
+        persist_path: stringValue(cfg.persist_path),
     });
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const [error, setError] = useState<string | undefined>();
+
+    function setField<K extends keyof VectorDbForm>(
+        key: K,
+        value: VectorDbForm[K],
+    ): void {
+        setFormData((prev) => ({ ...prev, [key]: value }));
+    }
 
-    function handleVectorDbSubmit(event: FormEvent<HTMLFormElement>): void {
+    async function handleSubmit(
+        event: FormEvent<HTMLFormElement>,
+    ): Promise<void> {
         event.preventDefault();
-        vectorDbForm.patch(updateVectorDbConfig.url(), {
-            preserveScroll: true,
-        });
+        setIsSubmitting(true);
+        setError(undefined);
+
+        try {
+            const payload: Record<string, unknown> = {};
+            if (formData.embedding_model) payload.embedding_model = formData.embedding_model;
+            if (formData.persist_path) payload.persist_path = formData.persist_path;
+            if (formData.chunk_size) payload.chunk_size = parseInt(formData.chunk_size, 10);
+            if (formData.chunk_overlap) payload.chunk_overlap = parseInt(formData.chunk_overlap, 10);
+
+            const result = await patchVectorDbConfig(payload);
+            setFormData({
+                chunk_overlap: stringValue(result.chunk_overlap),
+                chunk_size: stringValue(result.chunk_size),
+                embedding_model: stringValue(result.embedding_model),
+                persist_path: stringValue(result.persist_path),
+            });
+        } catch (e) {
+            setError(
+                e instanceof Error
+                    ? e.message
+                    : 'Gagal menyimpan konfigurasi Vector DB.',
+            );
+        } finally {
+            setIsSubmitting(false);
+        }
     }
 
     return (
         <Card className="border-(--lecturer-border) bg-(--lecturer-surface)">
             <CardContent className="pt-6">
-                <form className="grid gap-4" onSubmit={handleVectorDbSubmit}>
-                    <ConfigError
-                        message={readError(vectorDbForm.errors, 'vectorDb')}
-                    />
+                <form
+                    className="grid gap-4"
+                    onSubmit={(e) => {
+                        void handleSubmit(e);
+                    }}
+                >
+                    <ConfigError message={error} />
 
                     <div className="grid gap-3 md:grid-cols-2">
                         <Field label="Embedding Model">
                             <Input
-                                value={vectorDbForm.data.embedding_model}
+                                value={formData.embedding_model}
                                 onChange={(event) =>
-                                    vectorDbForm.setData(
+                                    setField(
                                         'embedding_model',
                                         event.target.value,
                                     )
@@ -67,12 +100,9 @@ export function AdminVectorDbForm({
                         </Field>
                         <Field label="Persist Path">
                             <Input
-                                value={vectorDbForm.data.persist_path}
+                                value={formData.persist_path}
                                 onChange={(event) =>
-                                    vectorDbForm.setData(
-                                        'persist_path',
-                                        event.target.value,
-                                    )
+                                    setField('persist_path', event.target.value)
                                 }
                             />
                         </Field>
@@ -80,12 +110,9 @@ export function AdminVectorDbForm({
                             <Input
                                 min="1"
                                 type="number"
-                                value={vectorDbForm.data.chunk_size}
+                                value={formData.chunk_size}
                                 onChange={(event) =>
-                                    vectorDbForm.setData(
-                                        'chunk_size',
-                                        event.target.value,
-                                    )
+                                    setField('chunk_size', event.target.value)
                                 }
                             />
                         </Field>
@@ -93,23 +120,17 @@ export function AdminVectorDbForm({
                             <Input
                                 min="0"
                                 type="number"
-                                value={vectorDbForm.data.chunk_overlap}
+                                value={formData.chunk_overlap}
                                 onChange={(event) =>
-                                    vectorDbForm.setData(
-                                        'chunk_overlap',
-                                        event.target.value,
-                                    )
+                                    setField('chunk_overlap', event.target.value)
                                 }
                             />
                         </Field>
                     </div>
 
                     <div className="flex justify-end">
-                        <Button
-                            disabled={vectorDbForm.processing}
-                            type="submit"
-                        >
-                            {vectorDbForm.processing ? (
+                        <Button disabled={isSubmitting} type="submit">
+                            {isSubmitting ? (
                                 <Spinner className="size-4" />
                             ) : (
                                 <Save className="size-4" />
@@ -128,92 +149,147 @@ export function AdminRetrievalForm({
 }: {
     retrieval?: RetrievalConfig | null;
 }) {
-    const retrievalConfig = retrieval ?? {};
-
-    const retrievalForm = useForm<RetrievalForm>({
-        bm25_weight: stringValue(retrievalConfig.bm25_weight),
-        candidate_pool_size: stringValue(retrievalConfig.candidate_pool_size),
-        dense_weight: stringValue(retrievalConfig.dense_weight),
-        enable_reranker: Boolean(retrievalConfig.enable_reranker),
-        history_turns: stringValue(retrievalConfig.history_turns),
-        lexical_weight: stringValue(retrievalConfig.lexical_weight),
-        max_context_chars: stringValue(retrievalConfig.max_context_chars),
-        neighbor_window: stringValue(retrievalConfig.neighbor_window),
-        reranker_model: stringValue(retrievalConfig.reranker_model),
-        similarity_threshold: stringValue(retrievalConfig.similarity_threshold),
-        top_k: stringValue(retrievalConfig.top_k),
+    const cfg = retrieval ?? {};
+    const [formData, setFormData] = useState<RetrievalForm>({
+        bm25_weight: stringValue(cfg.bm25_weight),
+        candidate_pool_size: stringValue(cfg.candidate_pool_size),
+        dense_weight: stringValue(cfg.dense_weight),
+        enable_reranker: Boolean(cfg.enable_reranker),
+        history_turns: stringValue(cfg.history_turns),
+        lexical_weight: stringValue(cfg.lexical_weight),
+        max_context_chars: stringValue(cfg.max_context_chars),
+        neighbor_window: stringValue(cfg.neighbor_window),
+        reranker_model: stringValue(cfg.reranker_model),
+        similarity_threshold: stringValue(cfg.similarity_threshold),
+        top_k: stringValue(cfg.top_k),
     });
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const [error, setError] = useState<string | undefined>();
 
-    function handleRetrievalSubmit(event: FormEvent<HTMLFormElement>): void {
+    function setField<K extends keyof RetrievalForm>(
+        key: K,
+        value: RetrievalForm[K],
+    ): void {
+        setFormData((prev) => ({ ...prev, [key]: value }));
+    }
+
+    async function handleSubmit(
+        event: FormEvent<HTMLFormElement>,
+    ): Promise<void> {
         event.preventDefault();
-        retrievalForm.patch(updateRetrievalConfig.url(), {
-            preserveScroll: true,
-        });
+        setIsSubmitting(true);
+        setError(undefined);
+
+        try {
+            const payload: Record<string, unknown> = {
+                enable_reranker: formData.enable_reranker,
+            };
+            if (formData.top_k) payload.top_k = parseInt(formData.top_k, 10);
+            if (formData.max_context_chars) payload.max_context_chars = parseInt(formData.max_context_chars, 10);
+            if (formData.bm25_weight) payload.bm25_weight = parseFloat(formData.bm25_weight);
+            if (formData.dense_weight) payload.dense_weight = parseFloat(formData.dense_weight);
+            if (formData.lexical_weight) payload.lexical_weight = parseFloat(formData.lexical_weight);
+            if (formData.similarity_threshold) payload.similarity_threshold = parseFloat(formData.similarity_threshold);
+            if (formData.history_turns) payload.history_turns = parseInt(formData.history_turns, 10);
+            if (formData.candidate_pool_size) payload.candidate_pool_size = parseInt(formData.candidate_pool_size, 10);
+            if (formData.neighbor_window) payload.neighbor_window = parseInt(formData.neighbor_window, 10);
+            if (formData.reranker_model) payload.reranker_model = formData.reranker_model;
+
+            const result = await patchRetrievalConfig(payload);
+            setFormData({
+                bm25_weight: stringValue(result.bm25_weight),
+                candidate_pool_size: stringValue(result.candidate_pool_size),
+                dense_weight: stringValue(result.dense_weight),
+                enable_reranker: Boolean(result.enable_reranker),
+                history_turns: stringValue(result.history_turns),
+                lexical_weight: stringValue(result.lexical_weight),
+                max_context_chars: stringValue(result.max_context_chars),
+                neighbor_window: stringValue(result.neighbor_window),
+                reranker_model: stringValue(result.reranker_model),
+                similarity_threshold: stringValue(result.similarity_threshold),
+                top_k: stringValue(result.top_k),
+            });
+        } catch (e) {
+            setError(
+                e instanceof Error
+                    ? e.message
+                    : 'Gagal menyimpan konfigurasi retrieval.',
+            );
+        } finally {
+            setIsSubmitting(false);
+        }
     }
 
     return (
         <Card className="border-(--lecturer-border) bg-(--lecturer-surface)">
             <CardContent className="pt-6">
-                <form className="grid gap-4" onSubmit={handleRetrievalSubmit}>
-                    <ConfigError
-                        message={readError(retrievalForm.errors, 'retrieval')}
-                    />
+                <form
+                    className="grid gap-4"
+                    onSubmit={(e) => {
+                        void handleSubmit(e);
+                    }}
+                >
+                    <ConfigError message={error} />
 
                     <div className="grid gap-3 md:grid-cols-2">
                         <RetrievalNumberField
-                            form={retrievalForm}
                             label="Top K"
-                            name="top_k"
+                            value={formData.top_k}
+                            onChange={(v) => setField('top_k', v)}
                         />
                         <RetrievalNumberField
-                            form={retrievalForm}
                             label="Max Context Chars"
-                            name="max_context_chars"
+                            value={formData.max_context_chars}
+                            onChange={(v) => setField('max_context_chars', v)}
                         />
                         <RetrievalNumberField
-                            form={retrievalForm}
                             label="BM25 Weight"
-                            name="bm25_weight"
                             step="0.01"
+                            value={formData.bm25_weight}
+                            onChange={(v) => setField('bm25_weight', v)}
                         />
                         <RetrievalNumberField
-                            form={retrievalForm}
                             label="Dense Weight"
-                            name="dense_weight"
                             step="0.01"
+                            value={formData.dense_weight}
+                            onChange={(v) => setField('dense_weight', v)}
                         />
                         <RetrievalNumberField
-                            form={retrievalForm}
                             label="Lexical Weight"
-                            name="lexical_weight"
                             step="0.01"
+                            value={formData.lexical_weight}
+                            onChange={(v) => setField('lexical_weight', v)}
                         />
                         <RetrievalNumberField
-                            form={retrievalForm}
                             label="Similarity Threshold"
-                            name="similarity_threshold"
                             step="0.01"
+                            value={formData.similarity_threshold}
+                            onChange={(v) =>
+                                setField('similarity_threshold', v)
+                            }
                         />
                         <RetrievalNumberField
-                            form={retrievalForm}
                             label="History Turns"
-                            name="history_turns"
+                            value={formData.history_turns}
+                            onChange={(v) => setField('history_turns', v)}
                         />
                         <RetrievalNumberField
-                            form={retrievalForm}
                             label="Candidate Pool"
-                            name="candidate_pool_size"
+                            value={formData.candidate_pool_size}
+                            onChange={(v) =>
+                                setField('candidate_pool_size', v)
+                            }
                         />
                         <RetrievalNumberField
-                            form={retrievalForm}
                             label="Neighbor Window"
-                            name="neighbor_window"
+                            value={formData.neighbor_window}
+                            onChange={(v) => setField('neighbor_window', v)}
                         />
                         <Field label="Reranker Model">
                             <Input
-                                value={retrievalForm.data.reranker_model}
+                                value={formData.reranker_model}
                                 onChange={(event) =>
-                                    retrievalForm.setData(
+                                    setField(
                                         'reranker_model',
                                         event.target.value,
                                     )
@@ -224,23 +300,17 @@ export function AdminRetrievalForm({
 
                     <label className="flex items-center gap-3 text-sm">
                         <Checkbox
-                            checked={retrievalForm.data.enable_reranker}
+                            checked={formData.enable_reranker}
                             onCheckedChange={(value) =>
-                                retrievalForm.setData(
-                                    'enable_reranker',
-                                    value === true,
-                                )
+                                setField('enable_reranker', value === true)
                             }
                         />
                         Enable reranker
                     </label>
 
                     <div className="flex justify-end">
-                        <Button
-                            disabled={retrievalForm.processing}
-                            type="submit"
-                        >
-                            {retrievalForm.processing ? (
+                        <Button disabled={isSubmitting} type="submit">
+                            {isSubmitting ? (
                                 <Spinner className="size-4" />
                             ) : (
                                 <Save className="size-4" />
@@ -261,232 +331,10 @@ export function AdminVectorRetrievalForms({
     retrieval?: RetrievalConfig | null;
     vectorDb?: VectorDbConfig | null;
 }) {
-    const vectorDbConfig = vectorDb ?? {};
-    const retrievalConfig = retrieval ?? {};
-
-    const vectorDbForm = useForm<VectorDbForm>({
-        chunk_overlap: stringValue(vectorDbConfig.chunk_overlap),
-        chunk_size: stringValue(vectorDbConfig.chunk_size),
-        embedding_model: stringValue(vectorDbConfig.embedding_model),
-        persist_path: stringValue(vectorDbConfig.persist_path),
-    });
-
-    const retrievalForm = useForm<RetrievalForm>({
-        bm25_weight: stringValue(retrievalConfig.bm25_weight),
-        candidate_pool_size: stringValue(retrievalConfig.candidate_pool_size),
-        dense_weight: stringValue(retrievalConfig.dense_weight),
-        enable_reranker: Boolean(retrievalConfig.enable_reranker),
-        history_turns: stringValue(retrievalConfig.history_turns),
-        lexical_weight: stringValue(retrievalConfig.lexical_weight),
-        max_context_chars: stringValue(retrievalConfig.max_context_chars),
-        neighbor_window: stringValue(retrievalConfig.neighbor_window),
-        reranker_model: stringValue(retrievalConfig.reranker_model),
-        similarity_threshold: stringValue(retrievalConfig.similarity_threshold),
-        top_k: stringValue(retrievalConfig.top_k),
-    });
-
-    function handleVectorDbSubmit(event: FormEvent<HTMLFormElement>): void {
-        event.preventDefault();
-        vectorDbForm.patch(updateVectorDbConfig.url(), {
-            preserveScroll: true,
-        });
-    }
-
-    function handleRetrievalSubmit(event: FormEvent<HTMLFormElement>): void {
-        event.preventDefault();
-        retrievalForm.patch(updateRetrievalConfig.url(), {
-            preserveScroll: true,
-        });
-    }
-
     return (
         <section className="grid gap-6 xl:grid-cols-2">
-            <Card className="border-(--lecturer-border) bg-(--lecturer-surface)">
-                <CardContent className="pt-6">
-                    <form
-                        className="grid gap-4"
-                        onSubmit={handleVectorDbSubmit}
-                    >
-                        <ConfigError
-                            message={readError(vectorDbForm.errors, 'vectorDb')}
-                        />
-
-                        <div className="grid gap-3 md:grid-cols-2">
-                            <Field label="Embedding Model">
-                                <Input
-                                    value={vectorDbForm.data.embedding_model}
-                                    onChange={(event) =>
-                                        vectorDbForm.setData(
-                                            'embedding_model',
-                                            event.target.value,
-                                        )
-                                    }
-                                />
-                            </Field>
-                            <Field label="Persist Path">
-                                <Input
-                                    value={vectorDbForm.data.persist_path}
-                                    onChange={(event) =>
-                                        vectorDbForm.setData(
-                                            'persist_path',
-                                            event.target.value,
-                                        )
-                                    }
-                                />
-                            </Field>
-                            <Field label="Chunk Size">
-                                <Input
-                                    min="1"
-                                    type="number"
-                                    value={vectorDbForm.data.chunk_size}
-                                    onChange={(event) =>
-                                        vectorDbForm.setData(
-                                            'chunk_size',
-                                            event.target.value,
-                                        )
-                                    }
-                                />
-                            </Field>
-                            <Field label="Chunk Overlap">
-                                <Input
-                                    min="0"
-                                    type="number"
-                                    value={vectorDbForm.data.chunk_overlap}
-                                    onChange={(event) =>
-                                        vectorDbForm.setData(
-                                            'chunk_overlap',
-                                            event.target.value,
-                                        )
-                                    }
-                                />
-                            </Field>
-                        </div>
-
-                        <div className="flex justify-end">
-                            <Button
-                                disabled={vectorDbForm.processing}
-                                type="submit"
-                            >
-                                {vectorDbForm.processing ? (
-                                    <Spinner className="size-4" />
-                                ) : (
-                                    <Save className="size-4" />
-                                )}
-                                Simpan Vector
-                            </Button>
-                        </div>
-                    </form>
-                </CardContent>
-            </Card>
-
-            <Card className="border-(--lecturer-border) bg-(--lecturer-surface)">
-                <CardContent className="pt-6">
-                    <form
-                        className="grid gap-4"
-                        onSubmit={handleRetrievalSubmit}
-                    >
-                        <ConfigError
-                            message={readError(
-                                retrievalForm.errors,
-                                'retrieval',
-                            )}
-                        />
-
-                        <div className="grid gap-3 md:grid-cols-2">
-                            <RetrievalNumberField
-                                form={retrievalForm}
-                                label="Top K"
-                                name="top_k"
-                            />
-                            <RetrievalNumberField
-                                form={retrievalForm}
-                                label="Max Context Chars"
-                                name="max_context_chars"
-                            />
-                            <RetrievalNumberField
-                                form={retrievalForm}
-                                label="BM25 Weight"
-                                name="bm25_weight"
-                                step="0.01"
-                            />
-                            <RetrievalNumberField
-                                form={retrievalForm}
-                                label="Dense Weight"
-                                name="dense_weight"
-                                step="0.01"
-                            />
-                            <RetrievalNumberField
-                                form={retrievalForm}
-                                label="Lexical Weight"
-                                name="lexical_weight"
-                                step="0.01"
-                            />
-                            <RetrievalNumberField
-                                form={retrievalForm}
-                                label="Similarity Threshold"
-                                name="similarity_threshold"
-                                step="0.01"
-                            />
-                            <RetrievalNumberField
-                                form={retrievalForm}
-                                label="History Turns"
-                                name="history_turns"
-                            />
-                            <RetrievalNumberField
-                                form={retrievalForm}
-                                label="Candidate Pool"
-                                name="candidate_pool_size"
-                            />
-                            <RetrievalNumberField
-                                form={retrievalForm}
-                                label="Neighbor Window"
-                                name="neighbor_window"
-                            />
-                            <Field label="Reranker Model">
-                                <Input
-                                    value={retrievalForm.data.reranker_model}
-                                    onChange={(event) =>
-                                        retrievalForm.setData(
-                                            'reranker_model',
-                                            event.target.value,
-                                        )
-                                    }
-                                />
-                            </Field>
-                        </div>
-
-                        <label className="flex items-center gap-3 text-sm">
-                            <Checkbox
-                                checked={retrievalForm.data.enable_reranker}
-                                onCheckedChange={(value) =>
-                                    retrievalForm.setData(
-                                        'enable_reranker',
-                                        value === true,
-                                    )
-                                }
-                            />
-                            Enable reranker
-                        </label>
-
-                        <div className="flex justify-end">
-                            <Button
-                                disabled={retrievalForm.processing}
-                                type="submit"
-                            >
-                                {retrievalForm.processing ? (
-                                    <Spinner className="size-4" />
-                                ) : (
-                                    <Save className="size-4" />
-                                )}
-                                Simpan Retrieval
-                            </Button>
-                        </div>
-                    </form>
-                </CardContent>
-            </Card>
+            <AdminVectorDbForm vectorDb={vectorDb} />
+            <AdminRetrievalForm retrieval={retrieval} />
         </section>
     );
 }
-
-
-

resources/js/lib/rag-client.ts

@@ -0,0 +1,325 @@
+import type {
+    ChatMessageResponse,
+    ChatSessionResponse,
+    CourseResponse,
+} from '@/lib/rag';
+import type {
+    AdminUser,
+    GeneratedApiKey,
+    LlmConfig,
+    RagConfig,
+    RetrievalConfig,
+    VectorDbConfig,
+} from '@/types/admin';
+
+export type { ChatMessageResponse, ChatSessionResponse, CourseResponse };
+
+export type DocumentResponse = {
+    id: string;
+    filename: string;
+    file_type: string;
+    file_size: number;
+    status: 'processing' | 'ready' | 'failed';
+    course_id: string;
+    course_name?: string;
+    uploaded_by: string;
+    uploader_name?: string;
+    summary?: string;
+    chunk_count?: number;
+    error?: string;
+    created_at: string;
+    updated_at: string;
+};
+
+export class RagApiError extends Error {
+    constructor(
+        message: string,
+        public readonly status: number,
+    ) {
+        super(message);
+        this.name = 'RagApiError';
+    }
+}
+
+const BASE_URL =
+    (import.meta.env.VITE_RAG_API_BASE_URL as string | undefined)?.replace(
+        /\/$/,
+        '',
+    ) ?? '';
+
+function getAuthToken(): string | null {
+    if (typeof document === 'undefined') {
+        return null;
+    }
+
+    const match = document.cookie.match(
+        /(?:^|;\s*)sevima_raghub_auth_token=([^;]*)/,
+    );
+
+    return match ? decodeURIComponent(match[1]) : null;
+}
+
+function makeHeaders(
+    extra: Record<string, string> = {},
+): Record<string, string> {
+    const token = getAuthToken();
+
+    return {
+        Accept: 'application/json',
+        ...(token ? { Authorization: `Bearer ${token}` } : {}),
+        ...extra,
+    };
+}
+
+async function readErrorMessage(response: Response): Promise<string> {
+    try {
+        const body = (await response
+            .clone()
+            .json()) as Record<string, unknown>;
+
+        if (typeof body.detail === 'string' && body.detail) {
+            return body.detail;
+        }
+
+        if (typeof body.message === 'string' && body.message) {
+            return body.message;
+        }
+
+        if (typeof body.error === 'string' && body.error) {
+            return body.error;
+        }
+    } catch {
+        // ignore
+    }
+
+    return `${response.status} ${response.statusText}`;
+}
+
+async function ragGet<T>(path: string): Promise<T> {
+    const response = await fetch(`${BASE_URL}${path}`, {
+        headers: makeHeaders(),
+    });
+
+    if (!response.ok) {
+        throw new RagApiError(await readErrorMessage(response), response.status);
+    }
+
+    return response.json() as Promise<T>;
+}
+
+async function ragJson<T>(
+    path: string,
+    method: string,
+    body: unknown,
+): Promise<T> {
+    const response = await fetch(`${BASE_URL}${path}`, {
+        body: JSON.stringify(body),
+        headers: makeHeaders({ 'Content-Type': 'application/json' }),
+        method,
+    });
+
+    if (!response.ok) {
+        throw new RagApiError(await readErrorMessage(response), response.status);
+    }
+
+    return response.json() as Promise<T>;
+}
+
+async function ragDelete(path: string): Promise<void> {
+    const response = await fetch(`${BASE_URL}${path}`, {
+        headers: makeHeaders(),
+        method: 'DELETE',
+    });
+
+    if (!response.ok) {
+        throw new RagApiError(await readErrorMessage(response), response.status);
+    }
+}
+
+// Courses
+
+export function listCourses(
+    page = 1,
+    limit = 100,
+): Promise<{ data: CourseResponse[] }> {
+    return ragGet(`/courses?page=${page}&limit=${limit}`);
+}
+
+export function getCourse(courseId: string): Promise<CourseResponse> {
+    return ragGet(`/courses/${encodeURIComponent(courseId)}`);
+}
+
+export function createCourse(payload: {
+    title: string;
+    description?: string;
+}): Promise<CourseResponse> {
+    return ragJson('/courses', 'POST', payload);
+}
+
+export function updateCourse(
+    courseId: string,
+    payload: { title?: string; description?: string },
+): Promise<CourseResponse> {
+    return ragJson(`/courses/${encodeURIComponent(courseId)}`, 'PUT', payload);
+}
+
+export function deleteCourse(courseId: string): Promise<void> {
+    return ragDelete(`/courses/${encodeURIComponent(courseId)}`);
+}
+
+export function listCourseDocuments(
+    courseId: string,
+): Promise<{ data: DocumentResponse[] }> {
+    return ragGet(`/courses/${encodeURIComponent(courseId)}/documents`);
+}
+
+export async function uploadDocument(
+    courseId: string,
+    file: File,
+): Promise<void> {
+    const token = getAuthToken();
+    const formData = new FormData();
+    formData.append('file', file);
+    formData.append('course_id', courseId);
+
+    const response = await fetch(`${BASE_URL}/documents/upload`, {
+        body: formData,
+        headers: {
+            ...(token ? { Authorization: `Bearer ${token}` } : {}),
+        },
+        method: 'POST',
+    });
+
+    if (!response.ok) {
+        throw new RagApiError(await readErrorMessage(response), response.status);
+    }
+}
+
+// Chat Sessions
+
+export function listChatSessions(
+    page = 1,
+    limit = 20,
+): Promise<{ data: ChatSessionResponse[] }> {
+    return ragGet(`/chats/sessions?page=${page}&limit=${limit}`);
+}
+
+export function getChatSession(
+    sessionId: string,
+): Promise<ChatSessionResponse> {
+    return ragGet(`/chats/sessions/${encodeURIComponent(sessionId)}`);
+}
+
+export function createChatSession(payload: {
+    course_id: string;
+    title: string;
+}): Promise<ChatSessionResponse> {
+    return ragJson('/chats/sessions', 'POST', payload);
+}
+
+export function deleteChatSession(sessionId: string): Promise<void> {
+    return ragDelete(`/chats/sessions/${encodeURIComponent(sessionId)}`);
+}
+
+export function getChatHistory(
+    sessionId: string,
+): Promise<{ data: ChatMessageResponse[] }> {
+    return ragGet(
+        `/chats/sessions/${encodeURIComponent(sessionId)}/messages`,
+    );
+}
+
+export async function openStreamChatMessage(
+    sessionId: string,
+    content: string,
+): Promise<Response> {
+    const token = getAuthToken();
+    const response = await fetch(
+        `${BASE_URL}/chats/sessions/${encodeURIComponent(sessionId)}/stream`,
+        {
+            body: JSON.stringify({ content }),
+            headers: {
+                Accept: 'text/event-stream',
+                'Content-Type': 'application/json',
+                ...(token ? { Authorization: `Bearer ${token}` } : {}),
+            },
+            method: 'POST',
+        },
+    );
+
+    if (!response.ok) {
+        throw new RagApiError(await readErrorMessage(response), response.status);
+    }
+
+    return response;
+}
+
+// Admin: RAG Config
+
+export function getRagConfig(): Promise<RagConfig> {
+    return ragGet('/admin/rag/config');
+}
+
+export function getLlmConfig(): Promise<LlmConfig> {
+    return ragGet('/admin/rag/config/llm');
+}
+
+export function patchLlmConfig(
+    payload: Record<string, unknown>,
+): Promise<LlmConfig> {
+    return ragJson('/admin/rag/config/llm', 'PATCH', payload);
+}
+
+export function getVectorDbConfig(): Promise<VectorDbConfig> {
+    return ragGet('/admin/rag/config/vector_db');
+}
+
+export function patchVectorDbConfig(
+    payload: Record<string, unknown>,
+): Promise<VectorDbConfig> {
+    return ragJson('/admin/rag/config/vector_db', 'PATCH', payload);
+}
+
+export function getRetrievalConfig(): Promise<RetrievalConfig> {
+    return ragGet('/admin/rag/config/retrieval');
+}
+
+export function patchRetrievalConfig(
+    payload: Record<string, unknown>,
+): Promise<RetrievalConfig> {
+    return ragJson('/admin/rag/config/retrieval', 'PATCH', payload);
+}
+
+// Admin: API Keys
+
+export function generateApiKey(): Promise<GeneratedApiKey> {
+    return ragJson('/auth/api-keys', 'POST', {});
+}
+
+// Admin: Users
+
+export function listAdminUsers(
+    query: Record<string, string> = {},
+): Promise<{ founds?: AdminUser[] }> {
+    const params = new URLSearchParams(query).toString();
+    const path = params ? `/user?${params}` : '/user';
+
+    return ragGet(path);
+}
+
+export function createAdminUser(
+    payload: Record<string, unknown>,
+): Promise<AdminUser> {
+    return ragJson('/user', 'POST', payload);
+}
+
+export function updateAdminUser(
+    userId: number | string,
+    payload: Record<string, unknown>,
+): Promise<AdminUser> {
+    return ragJson(`/user/${encodeURIComponent(String(userId))}`, 'PATCH', payload);
+}
+
+export function deleteAdminUser(userId: number | string): Promise<void> {
+    return ragDelete(`/user/${encodeURIComponent(String(userId))}`);
+}

resources/js/pages/admin/api-keys.tsx

@@ -1,12 +1,7 @@
 import { AdminApiKeyCard } from '@/components/admin/admin-api-key-card';
 import { AdminPage } from '@/components/admin/admin-page';
-import type { GeneratedApiKey } from '@/types/admin';
 
-type ApiKeysProps = {
-    generatedApiKey?: GeneratedApiKey | null;
-};
-
-export default function AdminApiKeys({ generatedApiKey }: ApiKeysProps) {
+export default function AdminApiKeys() {
     return (
         <AdminPage
             activeMenu="api-keys"
@@ -14,7 +9,7 @@ export default function AdminApiKeys({ generatedApiKey }: ApiKeysProps) {
             title="Generate API Key"
         >
             <div className="max-w-lg">
-                <AdminApiKeyCard generatedApiKey={generatedApiKey} />
+                <AdminApiKeyCard />
             </div>
         </AdminPage>
     );

resources/js/pages/admin/dashboard.tsx

@@ -1,12 +1,26 @@
+import { useEffect, useState } from 'react';
+
 import { AdminOverviewCards } from '@/components/admin/admin-overview-cards';
 import { AdminPage } from '@/components/admin/admin-page';
-import type { AdminDashboardProps } from '@/types/admin';
+import { listAdminUsers, getRagConfig } from '@/lib/rag-client';
+import type { AdminUser, RagConfig } from '@/types/admin';
+
+export default function AdminDashboard() {
+    const [ragConfig, setRagConfig] = useState<RagConfig | null>(null);
+    const [users, setUsers] = useState<AdminUser[]>([]);
+    const [isLoading, setIsLoading] = useState(true);
+    const [backendMessage, setBackendMessage] = useState<string | null>(null);
+
+    useEffect(() => {
+        Promise.all([getRagConfig(), listAdminUsers()])
+            .then(([config, usersResult]) => {
+                setRagConfig(config);
+                setUsers(usersResult.founds ?? []);
+            })
+            .catch((e: Error) => setBackendMessage(e.message))
+            .finally(() => setIsLoading(false));
+    }, []);
 
-export default function AdminDashboard({
-    backendMessage,
-    ragConfig,
-    users = [],
-}: AdminDashboardProps) {
     return (
         <AdminPage
             activeMenu="dashboard"
@@ -14,7 +28,9 @@ export default function AdminDashboard({
             description="Ringkasan konfigurasi RAG dan status sistem."
             title="Dashboard"
         >
-            <AdminOverviewCards ragConfig={ragConfig} users={users} />
+            {isLoading ? null : (
+                <AdminOverviewCards ragConfig={ragConfig} users={users} />
+            )}
         </AdminPage>
     );
 }

resources/js/pages/admin/llm-config.tsx

@@ -1,11 +1,22 @@
+import { useEffect, useState } from 'react';
+
 import { AdminLlmForm } from '@/components/admin/admin-llm-form';
 import { AdminPage } from '@/components/admin/admin-page';
-import type { AdminConfigPageProps } from '@/types/admin';
+import { getLlmConfig } from '@/lib/rag-client';
+import type { LlmConfig } from '@/types/admin';
+
+export default function AdminLlmConfig() {
+    const [llm, setLlm] = useState<LlmConfig | null>(null);
+    const [isLoading, setIsLoading] = useState(true);
+    const [backendMessage, setBackendMessage] = useState<string | null>(null);
+
+    useEffect(() => {
+        getLlmConfig()
+            .then(setLlm)
+            .catch((e: Error) => setBackendMessage(e.message))
+            .finally(() => setIsLoading(false));
+    }, []);
 
-export default function AdminLlmConfig({
-    backendMessage,
-    ragConfig,
-}: AdminConfigPageProps) {
     return (
         <AdminPage
             activeMenu="llm-config"
@@ -13,7 +24,7 @@ export default function AdminLlmConfig({
             description="Kelola provider, model, dan parameter LLM."
             title="LLM Config"
         >
-            <AdminLlmForm llm={ragConfig?.llm} />
+            {isLoading ? null : <AdminLlmForm llm={llm} />}
         </AdminPage>
     );
 }

resources/js/pages/admin/rag-config.tsx

@@ -1,11 +1,22 @@
+import { useEffect, useState } from 'react';
+
 import { AdminPage } from '@/components/admin/admin-page';
 import { AdminRagSummary } from '@/components/admin/admin-rag-summary';
-import type { AdminConfigPageProps } from '@/types/admin';
+import { getRagConfig } from '@/lib/rag-client';
+import type { RagConfig } from '@/types/admin';
+
+export default function AdminRagConfig() {
+    const [ragConfig, setRagConfig] = useState<RagConfig | null>(null);
+    const [isLoading, setIsLoading] = useState(true);
+    const [backendMessage, setBackendMessage] = useState<string | null>(null);
+
+    useEffect(() => {
+        getRagConfig()
+            .then(setRagConfig)
+            .catch((e: Error) => setBackendMessage(e.message))
+            .finally(() => setIsLoading(false));
+    }, []);
 
-export default function AdminRagConfig({
-    backendMessage,
-    ragConfig,
-}: AdminConfigPageProps) {
     return (
         <AdminPage
             activeMenu="rag-config"
@@ -13,7 +24,7 @@ export default function AdminRagConfig({
             description="Lihat ringkasan konfigurasi RAG yang aktif dari backend."
             title="RAG Config"
         >
-            <AdminRagSummary ragConfig={ragConfig} />
+            {isLoading ? null : <AdminRagSummary ragConfig={ragConfig} />}
         </AdminPage>
     );
 }

resources/js/pages/admin/retrieval-config.tsx

@@ -1,11 +1,22 @@
+import { useEffect, useState } from 'react';
+
 import { AdminPage } from '@/components/admin/admin-page';
 import { AdminRetrievalForm } from '@/components/admin/admin-vector-retrieval-forms';
-import type { AdminConfigPageProps } from '@/types/admin';
+import { getRetrievalConfig } from '@/lib/rag-client';
+import type { RetrievalConfig } from '@/types/admin';
+
+export default function AdminRetrievalConfig() {
+    const [retrieval, setRetrieval] = useState<RetrievalConfig | null>(null);
+    const [isLoading, setIsLoading] = useState(true);
+    const [backendMessage, setBackendMessage] = useState<string | null>(null);
+
+    useEffect(() => {
+        getRetrievalConfig()
+            .then(setRetrieval)
+            .catch((e: Error) => setBackendMessage(e.message))
+            .finally(() => setIsLoading(false));
+    }, []);
 
-export default function AdminRetrievalConfig({
-    backendMessage,
-    ragConfig,
-}: AdminConfigPageProps) {
     return (
         <AdminPage
             activeMenu="retrieval-config"
@@ -13,7 +24,7 @@ export default function AdminRetrievalConfig({
             description="Atur bobot retrieval, reranker, dan konteks jawaban."
             title="Retrieval Config"
         >
-            <AdminRetrievalForm retrieval={ragConfig?.retrieval} />
+            {isLoading ? null : <AdminRetrievalForm retrieval={retrieval} />}
         </AdminPage>
     );
 }

resources/js/pages/admin/vector-retrieval-config.tsx

@@ -1,11 +1,26 @@
+import { useEffect, useState } from 'react';
+
 import { AdminPage } from '@/components/admin/admin-page';
 import { AdminVectorRetrievalForms } from '@/components/admin/admin-vector-retrieval-forms';
-import type { AdminConfigPageProps } from '@/types/admin';
+import { getRetrievalConfig, getVectorDbConfig } from '@/lib/rag-client';
+import type { RetrievalConfig, VectorDbConfig } from '@/types/admin';
+
+export default function AdminVectorRetrievalConfig() {
+    const [vectorDb, setVectorDb] = useState<VectorDbConfig | null>(null);
+    const [retrieval, setRetrieval] = useState<RetrievalConfig | null>(null);
+    const [isLoading, setIsLoading] = useState(true);
+    const [backendMessage, setBackendMessage] = useState<string | null>(null);
+
+    useEffect(() => {
+        Promise.all([getVectorDbConfig(), getRetrievalConfig()])
+            .then(([vdb, ret]) => {
+                setVectorDb(vdb);
+                setRetrieval(ret);
+            })
+            .catch((e: Error) => setBackendMessage(e.message))
+            .finally(() => setIsLoading(false));
+    }, []);
 
-export default function AdminVectorRetrievalConfig({
-    backendMessage,
-    ragConfig,
-}: AdminConfigPageProps) {
     return (
         <AdminPage
             activeMenu="vector-retrieval-config"
@@ -13,10 +28,12 @@ export default function AdminVectorRetrievalConfig({
             description="Kelola konfigurasi VectorDB dan Retrieval."
             title="VectorDB & Retrieval Config"
         >
-            <AdminVectorRetrievalForms
-                retrieval={ragConfig?.retrieval}
-                vectorDb={ragConfig?.vector_db}
-            />
+            {isLoading ? null : (
+                <AdminVectorRetrievalForms
+                    retrieval={retrieval}
+                    vectorDb={vectorDb}
+                />
+            )}
         </AdminPage>
     );
 }

resources/js/pages/admin/vectordb-config.tsx

@@ -1,11 +1,22 @@
+import { useEffect, useState } from 'react';
+
 import { AdminPage } from '@/components/admin/admin-page';
 import { AdminVectorDbForm } from '@/components/admin/admin-vector-retrieval-forms';
-import type { AdminConfigPageProps } from '@/types/admin';
+import { getVectorDbConfig } from '@/lib/rag-client';
+import type { VectorDbConfig } from '@/types/admin';
+
+export default function AdminVectorDbConfig() {
+    const [vectorDb, setVectorDb] = useState<VectorDbConfig | null>(null);
+    const [isLoading, setIsLoading] = useState(true);
+    const [backendMessage, setBackendMessage] = useState<string | null>(null);
+
+    useEffect(() => {
+        getVectorDbConfig()
+            .then(setVectorDb)
+            .catch((e: Error) => setBackendMessage(e.message))
+            .finally(() => setIsLoading(false));
+    }, []);
 
-export default function AdminVectorDbConfig({
-    backendMessage,
-    ragConfig,
-}: AdminConfigPageProps) {
     return (
         <AdminPage
             activeMenu="vectordb-config"
@@ -13,7 +24,7 @@ export default function AdminVectorDbConfig({
             description="Atur model embedding dan konfigurasi chunking dokumen."
             title="VectorDB Config"
         >
-            <AdminVectorDbForm vectorDb={ragConfig?.vector_db} />
+            {isLoading ? null : <AdminVectorDbForm vectorDb={vectorDb} />}
         </AdminPage>
     );
 }

resources/js/pages/dosen-detail.tsx

@@ -1,4 +1,4 @@
-import { Head, router, useForm } from '@inertiajs/react';
+import { Head, router } from '@inertiajs/react';
 import {
     AlertCircle,
     ArrowLeft,
@@ -29,45 +29,23 @@ import {
     LoadingDots,
     LoadingIndicator,
 } from '@/components/ui/loading-indicator';
-import { dosen } from '@/routes';
 import {
-    destroy as destroyCourse,
-    update as updateCourse,
-} from '@/routes/dosen';
-import { store as uploadCourseDocument } from '@/routes/dosen/documents';
-
-type CourseResponse = {
-    id: number | string;
-    title: string;
-    description?: string | null;
-};
-
-type DocumentStatus = 'processing' | 'ready' | 'failed';
-
-type DocumentResponse = {
-    id: string;
-    filename: string;
-    file_type: string;
-    file_size: number;
-    status: DocumentStatus;
-    course_id: string;
-    course_name?: string;
-    uploaded_by: string;
-    uploader_name?: string;
-    summary?: string;
-    chunk_count?: number;
-    error?: string;
-    created_at: string;
-    updated_at: string;
-};
+    deleteCourse,
+    getCourse,
+    listCourseDocuments,
+    updateCourse,
+    uploadDocument,
+    type CourseResponse,
+    type DocumentResponse,
+} from '@/lib/rag-client';
+import { dosen } from '@/routes';
 
 type DosenDetailProps = {
-    backendMessage?: string | null;
-    course?: CourseResponse | null;
     courseId: string;
-    documents: DocumentResponse[];
 };
 
+type DocumentStatus = 'processing' | 'ready' | 'failed';
+
 type CourseForm = {
     title: string;
     description: string;
@@ -187,68 +165,63 @@ function DocumentCard({ document }: { document: DocumentResponse }) {
     );
 }
 
-export default function DosenDetail({
-    backendMessage,
-    course,
-    courseId,
-    documents,
-}: DosenDetailProps) {
+export default function DosenDetail({ courseId }: DosenDetailProps) {
+    const [course, setCourse] = useState<CourseResponse | null>(null);
+    const [documents, setDocuments] = useState<DocumentResponse[]>([]);
+    const [backendMessage, setBackendMessage] = useState<string>();
     const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false);
     const [isEditDialogOpen, setIsEditDialogOpen] = useState(false);
     const [isUploading, setIsUploading] = useState(false);
     const [uploadMessage, setUploadMessage] = useState<string>();
+    const [editForm, setEditFormData] = useState<CourseForm>(emptyCourseForm);
+    const [editFormError, setEditFormError] = useState<string>();
+    const [isUpdatingCourse, setIsUpdatingCourse] = useState(false);
+    const [isDeletingCourse, setIsDeletingCourse] = useState(false);
     const fileInputRef = useRef<HTMLInputElement>(null);
-    const editForm = useForm<CourseForm>(emptyCourseForm);
-    const deleteForm = useForm<Record<string, never>>({});
-    const editErrors = editForm.errors as Partial<
-        Record<keyof CourseForm | 'course', string>
-    >;
-    const deleteErrors = deleteForm.errors as Partial<
-        Record<'course', string>
-    >;
-    const editCourseMessage =
-        editErrors.course ?? editErrors.title ?? editErrors.description;
-    const deleteCourseMessage = deleteErrors.course;
-    const isUpdatingCourse = editForm.processing;
-    const isDeletingCourse = deleteForm.processing;
+
     const hasProcessingDocuments = documents.some(
         (document) => document.status === 'processing',
     );
 
+    useEffect(() => {
+        getCourse(courseId)
+            .then((c) => setCourse(c))
+            .catch((e: Error) => setBackendMessage(e.message));
+
+        listCourseDocuments(courseId)
+            .then((r) => setDocuments(r.data))
+            .catch(() => {});
+    }, [courseId]);
+
     useEffect(() => {
         if (!hasProcessingDocuments) {
             return;
         }
 
         const intervalId = window.setInterval(() => {
-            router.reload({
-                only: ['backendMessage', 'documents'],
-            });
+            listCourseDocuments(courseId)
+                .then((r) => setDocuments(r.data))
+                .catch(() => {});
         }, 7000);
 
         return () => window.clearInterval(intervalId);
-    }, [hasProcessingDocuments]);
+    }, [courseId, hasProcessingDocuments]);
 
-    function handleUploadDocument(file: File): void {
+    async function handleUploadDocument(file: File): Promise<void> {
         setUploadMessage(undefined);
-
-        router.post(
-            uploadCourseDocument.url(courseId),
-            { file },
-            {
-                forceFormData: true,
-                onError: (errors) => {
-                    const message = errors.file ?? errors.document;
-
-                    if (typeof message === 'string') {
-                        setUploadMessage(message);
-                    }
-                },
-                onFinish: () => setIsUploading(false),
-                onStart: () => setIsUploading(true),
-                preserveScroll: true,
-            },
-        );
+        setIsUploading(true);
+
+        try {
+            await uploadDocument(courseId, file);
+            const r = await listCourseDocuments(courseId);
+            setDocuments(r.data);
+        } catch (e) {
+            setUploadMessage(
+                e instanceof Error ? e.message : 'Gagal mengupload dokumen.',
+            );
+        } finally {
+            setIsUploading(false);
+        }
     }
 
     function handleEditDialogOpenChange(open: boolean): void {
@@ -257,23 +230,51 @@ export default function DosenDetail({
         }
 
         setIsEditDialogOpen(open);
-        editForm.clearErrors();
+        setEditFormError(undefined);
 
         if (open) {
-            editForm.setData({
+            setEditFormData({
                 description: course?.description ?? '',
                 title: course?.title ?? '',
             });
         }
     }
 
-    function handleUpdateCourseSubmit(event: FormEvent<HTMLFormElement>): void {
+    async function handleUpdateCourseSubmit(
+        event: FormEvent<HTMLFormElement>,
+    ): Promise<void> {
         event.preventDefault();
 
-        editForm.put(updateCourse.url(courseId), {
-            onSuccess: () => handleEditDialogOpenChange(false),
-            preserveScroll: true,
-        });
+        const title = editForm.title.trim();
+
+        if (!title) {
+            setEditFormError('Nama mata kuliah wajib diisi.');
+
+            return;
+        }
+
+        setEditFormError(undefined);
+        setIsUpdatingCourse(true);
+
+        try {
+            const payload: { title: string; description?: string } = { title };
+
+            if (editForm.description.trim()) {
+                payload.description = editForm.description.trim();
+            }
+
+            const updated = await updateCourse(courseId, payload);
+            setCourse(updated);
+            handleEditDialogOpenChange(false);
+        } catch (e) {
+            setEditFormError(
+                e instanceof Error
+                    ? e.message
+                    : 'Gagal memperbarui mata kuliah.',
+            );
+        } finally {
+            setIsUpdatingCourse(false);
+        }
     }
 
     function handleDeleteDialogOpenChange(open: boolean): void {
@@ -282,13 +283,22 @@ export default function DosenDetail({
         }
 
         setIsDeleteDialogOpen(open);
-        deleteForm.clearErrors();
     }
 
-    function handleDeleteCourse(): void {
-        deleteForm.delete(destroyCourse.url(courseId), {
-            preserveScroll: true,
-        });
+    async function handleDeleteCourse(): Promise<void> {
+        setIsDeletingCourse(true);
+
+        try {
+            await deleteCourse(courseId);
+            router.visit(dosen());
+        } catch (e) {
+            setBackendMessage(
+                e instanceof Error ? e.message : 'Gagal menghapus mata kuliah.',
+            );
+            handleDeleteDialogOpenChange(false);
+        } finally {
+            setIsDeletingCourse(false);
+        }
     }
 
     function handleFileInputChange(event: ChangeEvent<HTMLInputElement>): void {
@@ -296,7 +306,7 @@ export default function DosenDetail({
         event.target.value = '';
 
         if (file) {
-            handleUploadDocument(file);
+            void handleUploadDocument(file);
         }
     }
 
@@ -316,7 +326,7 @@ export default function DosenDetail({
         const file = event.dataTransfer.files[0];
 
         if (file) {
-            handleUploadDocument(file);
+            void handleUploadDocument(file);
         }
     }
 
@@ -468,7 +478,9 @@ export default function DosenDetail({
 
                         <form
                             className="lecturer-course-form"
-                            onSubmit={handleUpdateCourseSubmit}
+                            onSubmit={(e) => {
+                                void handleUpdateCourseSubmit(e);
+                            }}
                         >
                             <div className="lecturer-form-field">
                                 <Label
@@ -482,13 +494,13 @@ export default function DosenDetail({
                                     disabled={isUpdatingCourse}
                                     id="edit-course-title"
                                     onChange={(event) =>
-                                        editForm.setData(
-                                            'title',
-                                            event.target.value,
-                                        )
+                                        setEditFormData((prev) => ({
+                                            ...prev,
+                                            title: event.target.value,
+                                        }))
                                     }
                                     placeholder="Masukkan nama mata kuliah"
-                                    value={editForm.data.title}
+                                    value={editForm.title}
                                 />
                             </div>
 
@@ -504,19 +516,19 @@ export default function DosenDetail({
                                     disabled={isUpdatingCourse}
                                     id="edit-course-description"
                                     onChange={(event) =>
-                                        editForm.setData(
-                                            'description',
-                                            event.target.value,
-                                        )
+                                        setEditFormData((prev) => ({
+                                            ...prev,
+                                            description: event.target.value,
+                                        }))
                                     }
                                     placeholder="Masukkan deskripsi mata kuliah"
-                                    value={editForm.data.description}
+                                    value={editForm.description}
                                 />
                             </div>
 
-                            {editCourseMessage && (
+                            {editFormError && (
                                 <p className="lecturer-status" role="alert">
-                                    {editCourseMessage}
+                                    {editFormError}
                                 </p>
                             )}
 
@@ -572,12 +584,6 @@ export default function DosenDetail({
                                 dipakai.
                             </p>
 
-                            {deleteCourseMessage && (
-                                <p className="lecturer-status" role="alert">
-                                    {deleteCourseMessage}
-                                </p>
-                            )}
-
                             <DialogFooter className="lecturer-course-footer">
                                 <Button
                                     className="lecturer-cancel-button"
@@ -593,7 +599,9 @@ export default function DosenDetail({
                                 <Button
                                     className="lecturer-danger-action-button"
                                     disabled={isDeletingCourse}
-                                    onClick={handleDeleteCourse}
+                                    onClick={() => {
+                                        void handleDeleteCourse();
+                                    }}
                                     type="button"
                                 >
                                     {isDeletingCourse ? (

resources/js/pages/dosen.tsx

@@ -1,9 +1,8 @@
-import { Deferred, Head, router, useForm } from '@inertiajs/react';
+import { Head, router } from '@inertiajs/react';
 import type { LucideIcon } from 'lucide-react';
 import { AlertTriangle, Database, FileText, Plus, Search } from 'lucide-react';
-import type { FormEvent } from 'react';
-import type { ReactNode } from 'react';
-import { useMemo, useState } from 'react';
+import type { FormEvent, ReactNode } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 
 import AppearanceToggle from '@/components/appearance-toggle';
 import { DosenShell } from '@/components/dosen/dosen-shell';
@@ -20,15 +19,21 @@ import {
 import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import { LoadingIndicator } from '@/components/ui/loading-indicator';
+import {
+    createCourse,
+    listCourseDocuments,
+    listCourses,
+    type CourseResponse,
+    type DocumentResponse,
+} from '@/lib/rag-client';
 import { show as showDosenCourse } from '@/routes/dosen';
-import { store as storeDosenCourse } from '@/routes/dosen/courses';
 
 type KnowledgeBaseRow = {
     id: string;
     name: string;
     documentCount: number;
     failedDocumentCount: number;
-    hasError?: boolean;
+    hasError: boolean;
     updatedAt: string;
 };
 
@@ -45,15 +50,48 @@ type CourseForm = {
     description: string;
 };
 
-type DosenPageProps = {
-    knowledgeBases?: KnowledgeBaseRow[];
-};
-
 const emptyCourseForm: CourseForm = {
     description: '',
     title: '',
 };
 
+function formatUpdatedAt(value: string | undefined): string {
+    if (!value) {
+        return '-';
+    }
+
+    return value.split('T')[0] || value;
+}
+
+function latestDocumentUpdate(
+    documents: DocumentResponse[],
+): string | undefined {
+    const dates = documents
+        .map((d) => (typeof d.updated_at === 'string' ? d.updated_at : null))
+        .filter((d): d is string => d !== null)
+        .sort();
+
+    return dates[dates.length - 1];
+}
+
+function buildKnowledgeBaseRow(
+    course: CourseResponse,
+    documents: DocumentResponse[],
+): KnowledgeBaseRow {
+    const failedCount = documents.filter(
+        (d) => d.status === 'failed' || Boolean(d.error),
+    ).length;
+
+    return {
+        documentCount: documents.length,
+        failedDocumentCount: failedCount,
+        hasError: failedCount > 0,
+        id: String(course.id),
+        name: course.title,
+        updatedAt: formatUpdatedAt(latestDocumentUpdate(documents)),
+    };
+}
+
 function MetricCard({ metric }: { metric: Metric }) {
     const Icon = metric.icon;
 
@@ -78,51 +116,47 @@ function MetricCard({ metric }: { metric: Metric }) {
     );
 }
 
-export default function Dosen({ knowledgeBases }: DosenPageProps) {
-    const list = knowledgeBases ?? [];
+export default function Dosen() {
+    const [knowledgeBases, setKnowledgeBases] = useState<KnowledgeBaseRow[]>(
+        [],
+    );
+    const [isLoading, setIsLoading] = useState(true);
+    const [statusMessage, setStatusMessage] = useState<string>();
     const [isCourseDialogOpen, setIsCourseDialogOpen] = useState(false);
     const [searchQuery, setSearchQuery] = useState('');
-    const {
-        clearErrors,
-        data: courseForm,
-        errors,
-        post,
-        processing: isCreatingCourse,
-        reset,
-        setData: setCourseForm,
-    } = useForm<CourseForm>(emptyCourseForm);
-    const formErrors = errors as Partial<
-        Record<keyof CourseForm | 'course', string>
-    >;
-    const createCourseMessage =
-        formErrors.course ?? formErrors.title ?? formErrors.description;
-
-    function handleCourseDialogOpenChange(open: boolean): void {
-        setIsCourseDialogOpen(open);
-
-        if (!open) {
-            reset();
-            clearErrors();
-        }
-    }
-
-    function handleCreateCourseSubmit(
-        event: FormEvent<HTMLFormElement>,
-    ): void {
-        event.preventDefault();
+    const [courseForm, setCourseFormData] = useState<CourseForm>(emptyCourseForm);
+    const [courseFormError, setCourseFormError] = useState<string>();
+    const [isCreatingCourse, setIsCreatingCourse] = useState(false);
+
+    useEffect(() => {
+        listCourses()
+            .then(async (r) => {
+                const rows = await Promise.all(
+                    r.data.map(async (course) => {
+                        try {
+                            const docs = await listCourseDocuments(
+                                String(course.id),
+                            );
+
+                            return buildKnowledgeBaseRow(course, docs.data);
+                        } catch {
+                            return buildKnowledgeBaseRow(course, []);
+                        }
+                    }),
+                );
 
-        post(storeDosenCourse.url(), {
-            onSuccess: () => handleCourseDialogOpenChange(false),
-            preserveScroll: true,
-        });
-    }
+                setKnowledgeBases(rows);
+            })
+            .catch((e: Error) => setStatusMessage(e.message))
+            .finally(() => setIsLoading(false));
+    }, []);
 
     const metrics = useMemo<Metric[]>(() => {
-        const failedDocumentCount = list.reduce(
+        const failedDocumentCount = knowledgeBases.reduce(
             (total, item) => total + item.failedDocumentCount,
             0,
         );
-        const documentCount = list.reduce(
+        const documentCount = knowledgeBases.reduce(
             (total, item) => total + item.documentCount,
             0,
         );
@@ -132,7 +166,7 @@ export default function Dosen({ knowledgeBases }: DosenPageProps) {
                 icon: Database,
                 label: 'Total Knowledge Base',
                 tone: 'primary',
-                value: String(list.length),
+                value: String(knowledgeBases.length),
             },
             {
                 icon: FileText,
@@ -155,13 +189,215 @@ export default function Dosen({ knowledgeBases }: DosenPageProps) {
         const normalizedQuery = searchQuery.trim().toLowerCase();
 
         if (!normalizedQuery) {
-            return list;
+            return knowledgeBases;
         }
 
-        return list.filter((item) =>
+        return knowledgeBases.filter((item) =>
             item.name.toLowerCase().includes(normalizedQuery),
         );
-    }, [list, searchQuery]);
+    }, [knowledgeBases, searchQuery]);
+
+    function handleCourseDialogOpenChange(open: boolean): void {
+        setIsCourseDialogOpen(open);
+
+        if (!open) {
+            setCourseFormData(emptyCourseForm);
+            setCourseFormError(undefined);
+        }
+    }
+
+    async function handleCreateCourseSubmit(
+        event: FormEvent<HTMLFormElement>,
+    ): Promise<void> {
+        event.preventDefault();
+
+        const title = courseForm.title.trim();
+
+        if (!title) {
+            setCourseFormError('Nama mata kuliah wajib diisi.');
+
+            return;
+        }
+
+        setCourseFormError(undefined);
+        setIsCreatingCourse(true);
+
+        try {
+            const payload: { title: string; description?: string } = { title };
+
+            if (courseForm.description.trim()) {
+                payload.description = courseForm.description.trim();
+            }
+
+            const created = await createCourse(payload);
+
+            setKnowledgeBases((prev) => [
+                ...prev,
+                buildKnowledgeBaseRow(created, []),
+            ]);
+            handleCourseDialogOpenChange(false);
+        } catch (e) {
+            setCourseFormError(
+                e instanceof Error ? e.message : 'Gagal membuat mata kuliah.',
+            );
+        } finally {
+            setIsCreatingCourse(false);
+        }
+    }
+
+    const tableBody = isLoading ? (
+        <>
+            <section className="lecturer-metric-grid">
+                {[0, 1, 2].map((i) => (
+                    <Card className="lecturer-metric-card" key={i}>
+                        <CardContent className="lecturer-metric-content">
+                            <span className="lecturer-metric-icon animate-pulse bg-muted" />
+                            <div className="lecturer-metric-copy gap-2">
+                                <div className="animate-pulse h-3 w-24 rounded bg-muted" />
+                                <div className="animate-pulse h-5 w-12 rounded bg-muted" />
+                            </div>
+                        </CardContent>
+                    </Card>
+                ))}
+            </section>
+
+            <Card className="lecturer-table-card">
+                <CardContent className="lecturer-table-content">
+                    <div className="lecturer-table-wrap">
+                        <table className="lecturer-table">
+                            <thead>
+                                <tr>
+                                    <th>Nama Knowledge Base</th>
+                                    <th>Dokumen</th>
+                                    <th>Update Terakhir</th>
+                                    <th>Aksi</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                {[0, 1, 2].map((i) => (
+                                    <tr key={i}>
+                                        <td>
+                                            <div className="animate-pulse h-3.5 w-40 rounded bg-muted" />
+                                        </td>
+                                        <td>
+                                            <div className="animate-pulse h-3.5 w-10 rounded bg-muted" />
+                                        </td>
+                                        <td>
+                                            <div className="animate-pulse h-3.5 w-20 rounded bg-muted" />
+                                        </td>
+                                        <td>
+                                            <div className="animate-pulse h-3.5 w-12 rounded bg-muted" />
+                                        </td>
+                                    </tr>
+                                ))}
+                            </tbody>
+                        </table>
+                    </div>
+                </CardContent>
+            </Card>
+        </>
+    ) : (
+        <>
+            <section className="lecturer-metric-grid">
+                {metrics.map((metric) => (
+                    <MetricCard key={metric.label} metric={metric} />
+                ))}
+            </section>
+
+            <Card className="lecturer-table-card">
+                <CardContent className="lecturer-table-content">
+                    <div className="lecturer-table-heading">
+                        <h2>Daftar Mata Kuliah / Topik</h2>
+                        <div className="lecturer-search-field">
+                            <Search aria-hidden className="size-4" />
+                            <Input
+                                aria-label="Cari mata kuliah"
+                                className="lecturer-search-input"
+                                onChange={(event) =>
+                                    setSearchQuery(event.target.value)
+                                }
+                                placeholder="Cari mata kuliah..."
+                                type="search"
+                                value={searchQuery}
+                            />
+                        </div>
+                    </div>
+
+                    <div className="lecturer-table-wrap">
+                        <table className="lecturer-table">
+                            <thead>
+                                <tr>
+                                    <th>Nama Knowledge Base</th>
+                                    <th>Dokumen</th>
+                                    <th>Update Terakhir</th>
+                                    <th>Aksi</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                {knowledgeBases.length === 0 && (
+                                    <tr>
+                                        <td
+                                            className="lecturer-table-empty"
+                                            colSpan={4}
+                                        >
+                                            Belum ada knowledge base.
+                                        </td>
+                                    </tr>
+                                )}
+
+                                {knowledgeBases.length > 0 &&
+                                    filteredKnowledgeBases.length === 0 && (
+                                        <tr>
+                                            <td
+                                                className="lecturer-table-empty"
+                                                colSpan={4}
+                                            >
+                                                Mata kuliah tidak ditemukan.
+                                            </td>
+                                        </tr>
+                                    )}
+
+                                {filteredKnowledgeBases.map((item) => (
+                                    <tr key={item.id}>
+                                        <td>
+                                            <span className="lecturer-kb-name">
+                                                {item.name}
+                                            </span>
+                                        </td>
+                                        <td>
+                                            <span className="lecturer-doc-pill">
+                                                <FileText className="size-3.5" />
+                                                {item.documentCount}
+                                                {item.hasError && (
+                                                    <span className="lecturer-doc-error" />
+                                                )}
+                                            </span>
+                                        </td>
+                                        <td>{item.updatedAt}</td>
+                                        <td>
+                                            <button
+                                                className="lecturer-manage-button"
+                                                onClick={() =>
+                                                    router.visit(
+                                                        showDosenCourse(
+                                                            item.id,
+                                                        ),
+                                                    )
+                                                }
+                                                type="button"
+                                            >
+                                                Kelola
+                                            </button>
+                                        </td>
+                                    </tr>
+                                ))}
+                            </tbody>
+                        </table>
+                    </div>
+                </CardContent>
+            </Card>
+        </>
+    );
 
     return (
         <>
@@ -192,183 +428,13 @@ export default function Dosen({ knowledgeBases }: DosenPageProps) {
                         </div>
                     </section>
 
-                    <Deferred
-                        data="knowledgeBases"
-                        fallback={
-                            <>
-                                <section className="lecturer-metric-grid">
-                                    {[0, 1, 2].map((i) => (
-                                        <Card
-                                            className="lecturer-metric-card"
-                                            key={i}
-                                        >
-                                            <CardContent className="lecturer-metric-content">
-                                                <span className="lecturer-metric-icon animate-pulse bg-muted" />
-                                                <div className="lecturer-metric-copy gap-2">
-                                                    <div className="animate-pulse h-3 w-24 rounded bg-muted" />
-                                                    <div className="animate-pulse h-5 w-12 rounded bg-muted" />
-                                                </div>
-                                            </CardContent>
-                                        </Card>
-                                    ))}
-                                </section>
-
-                                <Card className="lecturer-table-card">
-                                    <CardContent className="lecturer-table-content">
-                                        <div className="lecturer-table-wrap">
-                                            <table className="lecturer-table">
-                                                <thead>
-                                                    <tr>
-                                                        <th>
-                                                            Nama Knowledge Base
-                                                        </th>
-                                                        <th>Dokumen</th>
-                                                        <th>
-                                                            Update Terakhir
-                                                        </th>
-                                                        <th>Aksi</th>
-                                                    </tr>
-                                                </thead>
-                                                <tbody>
-                                                    {[0, 1, 2].map((i) => (
-                                                        <tr key={i}>
-                                                            <td>
-                                                                <div className="animate-pulse h-3.5 w-40 rounded bg-muted" />
-                                                            </td>
-                                                            <td>
-                                                                <div className="animate-pulse h-3.5 w-10 rounded bg-muted" />
-                                                            </td>
-                                                            <td>
-                                                                <div className="animate-pulse h-3.5 w-20 rounded bg-muted" />
-                                                            </td>
-                                                            <td>
-                                                                <div className="animate-pulse h-3.5 w-12 rounded bg-muted" />
-                                                            </td>
-                                                        </tr>
-                                                    ))}
-                                                </tbody>
-                                            </table>
-                                        </div>
-                                    </CardContent>
-                                </Card>
-                            </>
-                        }
-                        rescue={
-                            <p className="lecturer-status" role="alert">
-                                Gagal memuat data knowledge base.
-                            </p>
-                        }
-                    >
-                        <section className="lecturer-metric-grid">
-                            {metrics.map((metric) => (
-                                <MetricCard key={metric.label} metric={metric} />
-                            ))}
-                        </section>
-
-                        <Card className="lecturer-table-card">
-                            <CardContent className="lecturer-table-content">
-                                <div className="lecturer-table-heading">
-                                    <h2>Daftar Mata Kuliah / Topik</h2>
-                                    <div className="lecturer-search-field">
-                                        <Search aria-hidden className="size-4" />
-                                        <Input
-                                            aria-label="Cari mata kuliah"
-                                            className="lecturer-search-input"
-                                            onChange={(event) =>
-                                                setSearchQuery(
-                                                    event.target.value,
-                                                )
-                                            }
-                                            placeholder="Cari mata kuliah..."
-                                            type="search"
-                                            value={searchQuery}
-                                        />
-                                    </div>
-                                </div>
-
-                                <div className="lecturer-table-wrap">
-                                    <table className="lecturer-table">
-                                        <thead>
-                                            <tr>
-                                                <th>Nama Knowledge Base</th>
-                                                <th>Dokumen</th>
-                                                <th>Update Terakhir</th>
-                                                <th>Aksi</th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            {list.length === 0 && (
-                                                <tr>
-                                                    <td
-                                                        className="lecturer-table-empty"
-                                                        colSpan={4}
-                                                    >
-                                                        Belum ada knowledge
-                                                        base.
-                                                    </td>
-                                                </tr>
-                                            )}
-
-                                            {list.length > 0 &&
-                                                filteredKnowledgeBases.length ===
-                                                    0 && (
-                                                    <tr>
-                                                        <td
-                                                            className="lecturer-table-empty"
-                                                            colSpan={4}
-                                                        >
-                                                            Mata kuliah tidak
-                                                            ditemukan.
-                                                        </td>
-                                                    </tr>
-                                                )}
+                    {statusMessage && (
+                        <p className="lecturer-status" role="alert">
+                            {statusMessage}
+                        </p>
+                    )}
 
-                                            {filteredKnowledgeBases.map(
-                                                (item) => (
-                                                    <tr key={item.id}>
-                                                        <td>
-                                                            <span className="lecturer-kb-name">
-                                                                {item.name}
-                                                            </span>
-                                                        </td>
-                                                        <td>
-                                                            <span className="lecturer-doc-pill">
-                                                                <FileText className="size-3.5" />
-                                                                {
-                                                                    item.documentCount
-                                                                }
-                                                                {item.hasError && (
-                                                                    <span className="lecturer-doc-error" />
-                                                                )}
-                                                            </span>
-                                                        </td>
-                                                        <td>
-                                                            {item.updatedAt}
-                                                        </td>
-                                                        <td>
-                                                            <button
-                                                                className="lecturer-manage-button"
-                                                                onClick={() =>
-                                                                    router.visit(
-                                                                        showDosenCourse(
-                                                                            item.id,
-                                                                        ),
-                                                                    )
-                                                                }
-                                                                type="button"
-                                                            >
-                                                                Kelola
-                                                            </button>
-                                                        </td>
-                                                    </tr>
-                                                ),
-                                            )}
-                                        </tbody>
-                                    </table>
-                                </div>
-                            </CardContent>
-                        </Card>
-                    </Deferred>
+                    {tableBody}
                 </main>
 
                 <Dialog
@@ -387,7 +453,7 @@ export default function Dosen({ knowledgeBases }: DosenPageProps) {
                         <form
                             className="lecturer-course-form"
                             onSubmit={(event) => {
-                                handleCreateCourseSubmit(event);
+                                void handleCreateCourseSubmit(event);
                             }}
                         >
                             <div className="lecturer-form-field">
@@ -402,10 +468,10 @@ export default function Dosen({ knowledgeBases }: DosenPageProps) {
                                     disabled={isCreatingCourse}
                                     id="course-title"
                                     onChange={(event) =>
-                                        setCourseForm(
-                                            'title',
-                                            event.target.value,
-                                        )
+                                        setCourseFormData((prev) => ({
+                                            ...prev,
+                                            title: event.target.value,
+                                        }))
                                     }
                                     placeholder="Masukkan nama mata kuliah"
                                     value={courseForm.title}
@@ -424,19 +490,19 @@ export default function Dosen({ knowledgeBases }: DosenPageProps) {
                                     disabled={isCreatingCourse}
                                     id="course-description"
                                     onChange={(event) =>
-                                        setCourseForm(
-                                            'description',
-                                            event.target.value,
-                                        )
+                                        setCourseFormData((prev) => ({
+                                            ...prev,
+                                            description: event.target.value,
+                                        }))
                                     }
                                     placeholder="Masukkan deskripsi mata kuliah"
                                     value={courseForm.description}
                                 />
                             </div>
 
-                            {createCourseMessage && (
+                            {courseFormError && (
                                 <p className="lecturer-status" role="alert">
-                                    {createCourseMessage}
+                                    {courseFormError}
                                 </p>
                             )}
 

resources/js/pages/mahasiswa-chat.tsx

@@ -10,14 +10,18 @@ import {
     useStoredStudentName,
 } from '@/components/student/student-shell';
 import { LoadingIndicator } from '@/components/ui/loading-indicator';
-import type {
-    ChatMessageResponse,
-    ChatSessionResponse,
-    CourseResponse,
-} from '@/lib/rag';
+import {
+    deleteChatSession,
+    getChatHistory,
+    getChatSession,
+    listChatSessions,
+    listCourses,
+    openStreamChatMessage,
+    type ChatMessageResponse,
+    type ChatSessionResponse,
+    type CourseResponse,
+} from '@/lib/rag-client';
 import { createLocalAssistantMessage, createLocalUserMessage } from '@/lib/rag';
-import { destroy as destroyMahasiswaSession } from '@/routes/mahasiswa';
-import { store as storeMahasiswaMessage } from '@/routes/mahasiswa/messages';
 
 type StoreMessageJsonResponse = {
     assistantMessage?: ChatMessageResponse;
@@ -41,18 +45,27 @@ type InitialQuestion = {
 };
 
 type MahasiswaChatProps = {
-    backendMessage?: string | null;
-    chatSessions: ChatSessionResponse[];
-    courses: CourseResponse[];
-    currentSession?: ChatSessionResponse | null;
-    initialQuestion?: InitialQuestion | null;
-    isDirectChatMode?: boolean;
-    isStreamChatMode?: boolean;
-    messages: ChatMessageResponse[];
-    selectedCourseId?: string | null;
     sessionId: string;
 };
 
+function readAndClearInitialQuestion(
+    sessionId: string,
+): InitialQuestion | undefined {
+    try {
+        const stored = sessionStorage.getItem(`rag_init_${sessionId}`);
+
+        if (!stored) {
+            return undefined;
+        }
+
+        sessionStorage.removeItem(`rag_init_${sessionId}`);
+
+        return JSON.parse(stored) as InitialQuestion;
+    } catch {
+        return undefined;
+    }
+}
+
 function isUserMessage(role: string): boolean {
     return ['human', 'student', 'user'].includes(role.toLowerCase());
 }
@@ -61,14 +74,6 @@ function isRecord(value: unknown): value is Record<string, unknown> {
     return typeof value === 'object' && value !== null && !Array.isArray(value);
 }
 
-function firstError(
-    errors: Record<string, string | string[]>,
-): string | undefined {
-    const [message] = Object.values(errors);
-
-    return Array.isArray(message) ? message[0] : message;
-}
-
 function firstPayloadError(value: unknown): string | undefined {
     if (typeof value === 'string') {
         return value;
@@ -123,14 +128,6 @@ function backendMessageFromPayload(payload: unknown): string | undefined {
     );
 }
 
-function csrfToken(): string | undefined {
-    return (
-        document
-            .querySelector<HTMLMetaElement>('meta[name="csrf-token"]')
-            ?.getAttribute('content') ?? undefined
-    );
-}
-
 function isStreamDebugEnabled(): boolean {
     if (import.meta.env.DEV) {
         return true;
@@ -165,45 +162,6 @@ function debugStream(label: string, value?: unknown): void {
     console.log(`[rag-stream] ${label}`, value);
 }
 
-async function storeChatMessage(
-    sessionId: string,
-    content: string,
-    courseId: string,
-): Promise<StoreMessageJsonResponse> {
-    const token = csrfToken();
-    const response = await fetch(storeMahasiswaMessage.url(sessionId), {
-        body: JSON.stringify({
-            content,
-            course_id: courseId,
-        }),
-        credentials: 'same-origin',
-        headers: {
-            Accept: 'application/json',
-            'Content-Type': 'application/json',
-            'X-Requested-With': 'XMLHttpRequest',
-            ...(token ? { 'X-CSRF-TOKEN': token } : {}),
-        },
-        method: 'POST',
-    });
-    const payload: unknown = await response.json().catch(() => undefined);
-
-    if (!response.ok) {
-        throw new BackendResponseError(
-            backendMessageFromPayload(payload) ?? '',
-        );
-    }
-
-    if (!isRecord(payload)) {
-        return {};
-    }
-
-    return {
-        assistantMessage: isRecord(payload.assistantMessage)
-            ? (payload.assistantMessage as ChatMessageResponse)
-            : undefined,
-    };
-}
-
 function isChatMessageResponse(value: unknown): value is ChatMessageResponse {
     return (
         isRecord(value) &&
@@ -448,32 +406,12 @@ function handleStreamPayload(
 async function streamChatMessage(
     sessionId: string,
     content: string,
-    courseId: string,
+    _courseId: string,
     onDelta: (delta: string) => void,
 ): Promise<StoreMessageJsonResponse> {
-    const token = csrfToken();
-
-    debugStream('request:start', {
-        content,
-        courseId,
-        sessionId,
-        url: storeMahasiswaMessage.url(sessionId),
-    });
+    debugStream('request:start', { content, sessionId });
 
-    const response = await fetch(storeMahasiswaMessage.url(sessionId), {
-        body: JSON.stringify({
-            content,
-            course_id: courseId,
-        }),
-        credentials: 'same-origin',
-        headers: {
-            Accept: 'text/event-stream',
-            'Content-Type': 'application/json',
-            'X-Requested-With': 'XMLHttpRequest',
-            ...(token ? { 'X-CSRF-TOKEN': token } : {}),
-        },
-        method: 'POST',
-    });
+    const response = await openStreamChatMessage(sessionId, content);
 
     debugStream('response', {
         contentType: response.headers.get('content-type'),
@@ -482,16 +420,6 @@ async function streamChatMessage(
         statusText: response.statusText,
     });
 
-    if (!response.ok) {
-        const payload: unknown = await response.json().catch(() => undefined);
-
-        debugStream('response:error-payload', payload);
-
-        throw new BackendResponseError(
-            backendMessageFromPayload(payload) ?? '',
-        );
-    }
-
     if (!response.body) {
         debugStream('response:no-body');
 
@@ -587,7 +515,9 @@ async function streamChatMessage(
 }
 
 function formatMessageTime(value: string): string {
-    const normalized = /[Zz]|[+-]\d{2}:?\d{2}$/.test(value) ? value : value + 'Z';
+    const normalized = /[Zz]|[+-]\d{2}:?\d{2}$/.test(value)
+        ? value
+        : value + 'Z';
     const date = new Date(normalized);
 
     if (Number.isNaN(date.getTime())) {
@@ -671,7 +601,6 @@ function ChatMessage({
                 <span className="student-message-time">
                     {formatMessageTime(message.created_at)}
                 </span>
-
             </div>
 
             {isUser && (
@@ -700,33 +629,26 @@ function appendUniqueMessages(
 const STREAM_TYPING_CHARS_PER_TICK = 2;
 const STREAM_TYPING_INTERVAL_MS = 14;
 
-export default function MahasiswaChat({
-    backendMessage: initialBackendMessage,
-    chatSessions,
-    courses,
-    currentSession,
-    initialQuestion,
-    isDirectChatMode = false,
-    isStreamChatMode = false,
-    messages: initialMessages,
-    selectedCourseId: initialSelectedCourseId,
-    sessionId,
-}: MahasiswaChatProps) {
-    const initialQuestionRef = useRef(initialQuestion ?? undefined);
+export default function MahasiswaChat({ sessionId }: MahasiswaChatProps) {
+    const initialQuestionRef = useRef<InitialQuestion | undefined>(
+        readAndClearInitialQuestion(sessionId),
+    );
     const hasStartedInitialQuestionRef = useRef(false);
-    const isWaitingForDirectAssistantRef = useRef(false);
     const streamingAssistantMessageRef = useRef<
         ChatMessageResponse | undefined
     >(undefined);
     const streamingTextQueueRef = useRef('');
     const streamingTypingTimerRef = useRef<number | undefined>(undefined);
     const streamingTypingWaitersRef = useRef<Array<() => void>>([]);
-    const knownMessageIdsRef = useRef(
-        new Set(initialMessages.map((message) => message.uuid_id)),
+
+    const [courses, setCourses] = useState<CourseResponse[]>([]);
+    const [chatSessions, setChatSessions] = useState<ChatSessionResponse[]>([]);
+    const [currentSession, setCurrentSession] =
+        useState<ChatSessionResponse | null>(null);
+    const [serverMessages, setServerMessages] = useState<ChatMessageResponse[]>(
+        [],
     );
     const [localBackendMessage, setLocalBackendMessage] = useState<string>();
-    const [animatedAssistantMessageId, setAnimatedAssistantMessageId] =
-        useState<string>();
     const [streamingAssistantMessageId, setStreamingAssistantMessageId] =
         useState<string>();
     const [isProcessing, setIsProcessing] = useState(false);
@@ -734,17 +656,36 @@ export default function MahasiswaChat({
         ChatMessageResponse[]
     >([]);
     const [question, setQuestion] = useState('');
-    const [selectedCourseId, setSelectedCourseId] = useState(
-        initialSelectedCourseId ?? currentSession?.course_id ?? '',
-    );
+    const [selectedCourseId, setSelectedCourseId] = useState('');
     const studentName = useStoredStudentName();
     const messagesEndRef = useRef<HTMLDivElement>(null);
-    const backendMessage = localBackendMessage ?? initialBackendMessage;
+
     const messages = useMemo(
-        () => appendUniqueMessages(initialMessages, optimisticMessages),
-        [initialMessages, optimisticMessages],
+        () => appendUniqueMessages(serverMessages, optimisticMessages),
+        [serverMessages, optimisticMessages],
     );
 
+    useEffect(() => {
+        listCourses()
+            .then((r) => setCourses(r.data))
+            .catch(() => {});
+
+        listChatSessions()
+            .then((r) => setChatSessions(r.data))
+            .catch(() => {});
+
+        getChatSession(sessionId)
+            .then((s) => {
+                setCurrentSession(s);
+                setSelectedCourseId(s.course_id);
+            })
+            .catch((e: Error) => setLocalBackendMessage(e.message));
+
+        getChatHistory(sessionId)
+            .then((r) => setServerMessages(r.data))
+            .catch(() => {});
+    }, [sessionId]);
+
     const composerCourses = useMemo(() => {
         if (
             !currentSession ||
@@ -763,25 +704,6 @@ export default function MahasiswaChat({
         ];
     }, [courses, currentSession, selectedCourseId]);
 
-    useEffect(() => {
-        if (isDirectChatMode && isWaitingForDirectAssistantRef.current) {
-            const newAssistantMessage = messages.find(
-                (message) =>
-                    !knownMessageIdsRef.current.has(message.uuid_id) &&
-                    !isUserMessage(message.role),
-            );
-
-            if (newAssistantMessage) {
-                setAnimatedAssistantMessageId(newAssistantMessage.uuid_id);
-                isWaitingForDirectAssistantRef.current = false;
-            }
-        }
-
-        for (const message of messages) {
-            knownMessageIdsRef.current.add(message.uuid_id);
-        }
-    }, [isDirectChatMode, messages]);
-
     useEffect(() => {
         const scrollFrame = window.requestAnimationFrame(() => {
             messagesEndRef.current?.scrollIntoView({
@@ -792,51 +714,6 @@ export default function MahasiswaChat({
         return () => window.cancelAnimationFrame(scrollFrame);
     }, [messages, isProcessing]);
 
-    useEffect(() => {
-        const initial = initialQuestionRef.current;
-
-        if (!initial || hasStartedInitialQuestionRef.current) {
-            return;
-        }
-
-        hasStartedInitialQuestionRef.current = true;
-
-        const userMessage = createLocalUserMessage(initial.content);
-        setOptimisticMessages([userMessage]);
-        setIsProcessing(true);
-
-        void (async () => {
-            try {
-                const response = await storeChatMessage(
-                    sessionId,
-                    initial.content,
-                    initial.courseId,
-                );
-
-                if (response.assistantMessage) {
-                    setAnimatedAssistantMessageId(
-                        response.assistantMessage.uuid_id,
-                    );
-                    setOptimisticMessages((currentMessages) =>
-                        appendUniqueMessages(currentMessages, [
-                            response.assistantMessage!,
-                        ]),
-                    );
-                }
-            } catch (error) {
-                setOptimisticMessages([]);
-                setQuestion(initial.content);
-                setLocalBackendMessage(
-                    error instanceof Error && error.message
-                        ? error.message
-                        : 'Gagal mengirim pesan. Silakan coba lagi.',
-                );
-            } finally {
-                setIsProcessing(false);
-            }
-        })();
-    }, [sessionId]);
-
     const resolveStreamingTypingWaiters = useCallback((): void => {
         const waiters = streamingTypingWaitersRef.current;
         streamingTypingWaitersRef.current = [];
@@ -993,51 +870,29 @@ export default function MahasiswaChat({
             optimisticUserMessage?: ChatMessageResponse,
         ): void => {
             setLocalBackendMessage(undefined);
-            isWaitingForDirectAssistantRef.current = isDirectChatMode;
             setIsProcessing(true);
+            setStreamingAssistantContent('');
 
             void (async () => {
                 try {
-                    const shouldUseStream = isStreamChatMode;
-
-                    if (shouldUseStream) {
-                        setStreamingAssistantContent('');
-                    }
+                    const response = await streamChatMessage(
+                        sessionId,
+                        content,
+                        courseId,
+                        appendStreamingAssistantDelta,
+                    );
 
-                    const response = shouldUseStream
-                        ? await streamChatMessage(
-                              sessionId,
-                              content,
-                              courseId,
-                              appendStreamingAssistantDelta,
-                          )
-                        : await storeChatMessage(sessionId, content, courseId);
-
-                    if (shouldUseStream) {
-                        await waitForStreamingTyping();
-                    }
+                    await waitForStreamingTyping();
 
                     if (response.assistantMessage) {
-                        const assistantMessage = response.assistantMessage;
-
-                        if (shouldUseStream) {
-                            replaceStreamingAssistantMessage(assistantMessage);
-                        } else {
-                            setAnimatedAssistantMessageId(
-                                assistantMessage.uuid_id,
-                            );
-                            setOptimisticMessages((currentMessages) =>
-                                appendUniqueMessages(currentMessages, [
-                                    assistantMessage,
-                                ]),
-                            );
-                        }
+                        replaceStreamingAssistantMessage(
+                            response.assistantMessage,
+                        );
                     }
 
                     setQuestion('');
                 } catch (error) {
                     debugStream('request:error', error);
-                    isWaitingForDirectAssistantRef.current = false;
                     const streamingMessageId =
                         streamingAssistantMessageRef.current?.uuid_id;
                     clearStreamingTyping();
@@ -1101,8 +956,6 @@ export default function MahasiswaChat({
         [
             appendStreamingAssistantDelta,
             clearStreamingTyping,
-            isDirectChatMode,
-            isStreamChatMode,
             replaceStreamingAssistantMessage,
             setStreamingAssistantContent,
             sessionId,
@@ -1110,22 +963,102 @@ export default function MahasiswaChat({
         ],
     );
 
+    useEffect(() => {
+        const initial = initialQuestionRef.current;
+
+        if (!initial || hasStartedInitialQuestionRef.current) {
+            return;
+        }
+
+        hasStartedInitialQuestionRef.current = true;
+
+        const userMessage = createLocalUserMessage(initial.content);
+        setOptimisticMessages([userMessage]);
+        setIsProcessing(true);
+        setStreamingAssistantContent('');
+
+        void (async () => {
+            try {
+                const response = await streamChatMessage(
+                    sessionId,
+                    initial.content,
+                    initial.courseId,
+                    appendStreamingAssistantDelta,
+                );
+
+                await waitForStreamingTyping();
+
+                if (response.assistantMessage) {
+                    replaceStreamingAssistantMessage(response.assistantMessage);
+                }
+            } catch (error) {
+                const streamingMessageId =
+                    streamingAssistantMessageRef.current?.uuid_id;
+                clearStreamingTyping();
+                streamingAssistantMessageRef.current = undefined;
+                setStreamingAssistantMessageId(undefined);
+                setOptimisticMessages([]);
+                setQuestion(initial.content);
+                const errorMessage =
+                    error instanceof Error ? error.message : '';
+                const isGenericError =
+                    !errorMessage ||
+                    errorMessage === 'Internal Server Error' ||
+                    errorMessage === 'Server Error';
+
+                if (streamingMessageId) {
+                    setOptimisticMessages((prev) =>
+                        prev.filter((m) => m.uuid_id !== streamingMessageId),
+                    );
+                }
+
+                setLocalBackendMessage(
+                    isGenericError
+                        ? 'Gagal mengirim pesan. Silakan coba lagi.'
+                        : errorMessage,
+                );
+            } finally {
+                const emptyStreamingMessage =
+                    streamingAssistantMessageRef.current?.content === ''
+                        ? streamingAssistantMessageRef.current
+                        : undefined;
+                clearStreamingTyping();
+                streamingAssistantMessageRef.current = undefined;
+                setStreamingAssistantMessageId(undefined);
+                setIsProcessing(false);
+
+                if (emptyStreamingMessage) {
+                    setOptimisticMessages((currentMessages) =>
+                        currentMessages.filter(
+                            (message) =>
+                                message.uuid_id !== emptyStreamingMessage.uuid_id,
+                        ),
+                    );
+                }
+            }
+        })();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [sessionId]);
+
     const handleDeleteSession = (
         targetSessionId: string,
-    ): Promise<DeleteSessionResult> => {
-        return new Promise((resolve) => {
-            router.delete(destroyMahasiswaSession.url(targetSessionId), {
-                data: { active_session_id: sessionId },
-                onError: (errors) => {
-                    const message = firstError(errors);
-                    setLocalBackendMessage(message);
-                    resolve({ message, ok: false });
-                },
-                onSuccess: () => resolve({ ok: true }),
-                preserveScroll: true,
-            });
-        });
-    };
+    ): Promise<DeleteSessionResult> =>
+        deleteChatSession(targetSessionId)
+            .then(() => {
+                setChatSessions((prev) =>
+                    prev.filter((s) => s.uuid_id !== targetSessionId),
+                );
+
+                if (targetSessionId === sessionId) {
+                    router.visit('/mahasiswa');
+                }
+
+                return { ok: true } as DeleteSessionResult;
+            })
+            .catch((e: Error) => ({
+                message: e.message,
+                ok: false,
+            }));
 
     const handleQuestionSubmit = (event: FormEvent<HTMLFormElement>): void => {
         event.preventDefault();
@@ -1145,6 +1078,8 @@ export default function MahasiswaChat({
         sendMessage(trimmedQuestion, selectedCourseId, userMessage);
     };
 
+    const backendMessage = localBackendMessage;
+
     return (
         <>
             <Head title={currentSession?.title ?? 'RAG Hub'} />
@@ -1169,10 +1104,7 @@ export default function MahasiswaChat({
                                 <ChatMessage
                                     key={message.uuid_id}
                                     message={message}
-                                    shouldAnimateTyping={
-                                        message.uuid_id ===
-                                        animatedAssistantMessageId
-                                    }
+                                    shouldAnimateTyping={false}
                                 />
                             ))}
 
@@ -1209,7 +1141,6 @@ export default function MahasiswaChat({
                             selectedCourseId={selectedCourseId}
                             variant="dock"
                         />
-
                     </div>
                 </div>
             </StudentShell>

resources/js/pages/mahasiswa.tsx

@@ -1,7 +1,7 @@
 import { Head, router } from '@inertiajs/react';
 import { Bot, MessageSquare } from 'lucide-react';
 import type { FormEvent } from 'react';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 
 import { QuestionComposer } from '@/components/student/question-composer';
 import type { DeleteSessionResult } from '@/components/student/student-shell';
@@ -10,59 +10,62 @@ import {
     useStoredStudentName,
 } from '@/components/student/student-shell';
 import { LoadingIndicator } from '@/components/ui/loading-indicator';
-import type { ChatSessionResponse, CourseResponse } from '@/lib/rag';
-import { destroy as destroyMahasiswaSession } from '@/routes/mahasiswa';
-import { store as storeMahasiswaSession } from '@/routes/mahasiswa/sessions';
-
-type MahasiswaProps = {
-    backendMessage?: string | null;
-    chatSessions: ChatSessionResponse[];
-    courses: CourseResponse[];
-    selectedCourseId?: string | null;
-};
-
-function firstError(
-    errors: Record<string, string | string[]>,
-): string | undefined {
-    const [message] = Object.values(errors);
-
-    return Array.isArray(message) ? message[0] : message;
-}
-
-export default function Mahasiswa({
-    backendMessage: initialBackendMessage,
-    chatSessions,
-    courses,
-    selectedCourseId: initialSelectedCourseId,
-}: MahasiswaProps) {
-    const [localBackendMessage, setLocalBackendMessage] = useState<string>();
+import {
+    createChatSession,
+    deleteChatSession,
+    listChatSessions,
+    listCourses,
+    type ChatSessionResponse,
+    type CourseResponse,
+} from '@/lib/rag-client';
+import { show as showMahasiswaChat } from '@/routes/mahasiswa';
+
+export default function Mahasiswa() {
+    const [courses, setCourses] = useState<CourseResponse[]>([]);
+    const [chatSessions, setChatSessions] = useState<ChatSessionResponse[]>([]);
+    const [isLoadingCourses, setIsLoadingCourses] = useState(true);
+    const [backendMessage, setBackendMessage] = useState<string>();
     const [isProcessing, setIsProcessing] = useState(false);
     const [question, setQuestion] = useState('');
-    const [selectedCourseId, setSelectedCourseId] = useState(
-        initialSelectedCourseId ??
-            (courses[0]?.id === undefined ? '' : String(courses[0].id)),
-    );
+    const [selectedCourseId, setSelectedCourseId] = useState('');
     const studentName = useStoredStudentName();
-    const backendMessage = localBackendMessage ?? initialBackendMessage;
+
+    useEffect(() => {
+        listCourses()
+            .then((r) => {
+                setCourses(r.data);
+
+                if (r.data[0] !== undefined) {
+                    setSelectedCourseId(String(r.data[0].id));
+                }
+            })
+            .catch((e: Error) => setBackendMessage(e.message))
+            .finally(() => setIsLoadingCourses(false));
+
+        listChatSessions()
+            .then((r) => setChatSessions(r.data))
+            .catch(() => {});
+    }, []);
 
     const handleDeleteSession = (
         targetSessionId: string,
-    ): Promise<DeleteSessionResult> => {
-        return new Promise((resolve) => {
-            router.delete(destroyMahasiswaSession.url(targetSessionId), {
-                data: { active_session_id: '' },
-                onError: (errors) => {
-                    const message = firstError(errors);
-                    setLocalBackendMessage(message);
-                    resolve({ message, ok: false });
-                },
-                onSuccess: () => resolve({ ok: true }),
-                preserveScroll: true,
-            });
-        });
-    };
-
-    const handleQuestionSubmit = (event: FormEvent<HTMLFormElement>): void => {
+    ): Promise<DeleteSessionResult> =>
+        deleteChatSession(targetSessionId)
+            .then(() => {
+                setChatSessions((prev) =>
+                    prev.filter((s) => s.uuid_id !== targetSessionId),
+                );
+
+                return { ok: true } as DeleteSessionResult;
+            })
+            .catch((e: Error) => ({
+                message: e.message,
+                ok: false,
+            }));
+
+    const handleQuestionSubmit = async (
+        event: FormEvent<HTMLFormElement>,
+    ): Promise<void> => {
         event.preventDefault();
 
         const trimmedQuestion = question.trim();
@@ -71,22 +74,30 @@ export default function Mahasiswa({
             return;
         }
 
-        setLocalBackendMessage(undefined);
+        setBackendMessage(undefined);
+        setIsProcessing(true);
 
-        router.post(
-            storeMahasiswaSession.url(),
-            {
+        try {
+            const session = await createChatSession({
                 course_id: selectedCourseId,
                 title: trimmedQuestion,
-            },
-            {
-                onError: (errors) => {
-                    setLocalBackendMessage(firstError(errors));
-                },
-                onFinish: () => setIsProcessing(false),
-                onStart: () => setIsProcessing(true),
-            },
-        );
+            });
+
+            sessionStorage.setItem(
+                `rag_init_${session.uuid_id}`,
+                JSON.stringify({
+                    content: trimmedQuestion,
+                    courseId: selectedCourseId,
+                }),
+            );
+
+            router.visit(showMahasiswaChat.url(session.uuid_id));
+        } catch (e) {
+            setBackendMessage(
+                e instanceof Error ? e.message : 'Gagal membuat sesi.',
+            );
+            setIsProcessing(false);
+        }
     };
 
     return (
@@ -142,7 +153,7 @@ export default function Mahasiswa({
 
                         <QuestionComposer
                             courses={courses}
-                            isLoadingCourses={false}
+                            isLoadingCourses={isLoadingCourses}
                             isProcessing={isProcessing}
                             onCourseChange={setSelectedCourseId}
                             onQuestionChange={setQuestion}

resources/js/types/admin.ts

@@ -60,19 +60,6 @@ export type GeneratedApiKey = {
     expires_at?: string | null;
 };
 
-export type AdminDashboardProps = {
-    backendMessage?: string | null;
-    generatedApiKey?: GeneratedApiKey | null;
-    ragConfig?: RagConfig | null;
-    userFilters?: Record<string, unknown>;
-    users?: AdminUser[];
-};
-
-export type AdminConfigPageProps = {
-    backendMessage?: string | null;
-    ragConfig?: RagConfig | null;
-};
-
 export type LlmForm = {
     api_key_env: string;
     base_url: string;

routes/web.php

@@ -49,49 +49,21 @@
 
     Route::get('api-keys', [AdminController::class, 'apiKeys'])->name('api-keys.index');
 
-    Route::post('api-keys', [AdminController::class, 'generateApiKey'])->name('api-keys.store');
-
-    Route::patch('rag/llm', [AdminController::class, 'updateLlmConfig'])->name('rag.llm.update');
-
-    Route::patch('rag/retrieval', [AdminController::class, 'updateRetrievalConfig'])->name('rag.retrieval.update');
-
-    Route::patch('rag/vector-db', [AdminController::class, 'updateVectorDbConfig'])->name('rag.vector-db.update');
-
-    Route::post('users', [AdminController::class, 'storeUser'])->name('users.store');
-
-    Route::patch('users/{userId}', [AdminController::class, 'updateUser'])->name('users.update');
-
-    Route::delete('users/{userId}', [AdminController::class, 'destroyUser'])->name('users.destroy');
-
     Route::get('pengaturan', [AdminController::class, 'settings'])->name('pengaturan');
 });
 
 Route::middleware('rag.auth:student')->group(function (): void {
     Route::get('mahasiswa', [MahasiswaController::class, 'index'])->name('mahasiswa');
 
-    Route::post('mahasiswa/sessions', [MahasiswaController::class, 'storeSession'])->name('mahasiswa.sessions.store');
-
     Route::get('mahasiswa/{sessionId}', [MahasiswaController::class, 'show'])->name('mahasiswa.show');
-
-    Route::post('mahasiswa/{sessionId}/messages', [MahasiswaController::class, 'storeMessage'])->name('mahasiswa.messages.store');
-
-    Route::delete('mahasiswa/{sessionId}', [MahasiswaController::class, 'destroySession'])->name('mahasiswa.destroy');
 });
 
 Route::middleware('rag.auth:lecturer')->group(function (): void {
     Route::get('dosen', [DosenController::class, 'index'])->name('dosen');
 
-    Route::post('dosen/courses', [DosenController::class, 'storeCourse'])->name('dosen.courses.store');
-
     Route::inertia('dosen/pengaturan', 'dosen/pengaturan')->name('dosen.pengaturan');
 
-    Route::post('dosen/{courseId}/documents', [DosenController::class, 'uploadDocument'])->name('dosen.documents.store');
-
     Route::get('dosen/{courseId}', [DosenController::class, 'show'])->name('dosen.show');
-
-    Route::put('dosen/{courseId}', [DosenController::class, 'updateCourse'])->name('dosen.update');
-
-    Route::delete('dosen/{courseId}', [DosenController::class, 'destroyCourse'])->name('dosen.destroy');
 });
 
 require __DIR__.'/settings.php';

sevima-raghub.json

@@ -267,6 +267,28 @@
                         },
                         "name": "course_id",
                         "in": "path"
+                    },
+                    {
+                        "required": false,
+                        "schema": {
+                            "type": "integer",
+                            "minimum": 1.0,
+                            "title": "Page",
+                            "default": 1
+                        },
+                        "name": "page",
+                        "in": "query"
+                    },
+                    {
+                        "required": false,
+                        "schema": {
+                            "type": "integer",
+                            "minimum": 1.0,
+                            "title": "Limit",
+                            "default": 10
+                        },
+                        "name": "limit",
+                        "in": "query"
                     }
                 ],
                 "responses": {
@@ -1083,6 +1105,28 @@
                         },
                         "name": "session_id",
                         "in": "path"
+                    },
+                    {
+                        "required": false,
+                        "schema": {
+                            "type": "integer",
+                            "minimum": 1.0,
+                            "title": "Page",
+                            "default": 1
+                        },
+                        "name": "page",
+                        "in": "query"
+                    },
+                    {
+                        "required": false,
+                        "schema": {
+                            "type": "integer",
+                            "minimum": 1.0,
+                            "title": "Limit",
+                            "default": 20
+                        },
+                        "name": "limit",
+                        "in": "query"
                     }
                 ],
                 "responses": {
@@ -1495,6 +1539,300 @@
                     }
                 ]
             }
+        },
+        "/api/v1/auth/api-key/generate": {
+            "post": {
+                "tags": ["v1", "auth-iframe"],
+                "summary": "Generate Api Key",
+                "description": "Generate API key for Iframe SSO.\nValidates source domain against whitelist.\n\nUser data fields (email, username, phone, name, identity_number) are passed\nbut only email, username, and name are stored in the User table.",
+                "operationId": "generate_api_key_api_v1_auth_api_key_generate_post",
+                "requestBody": {
+                    "content": {
+                        "application/json": {
+                            "schema": {
+                                "$ref": "#/components/schemas/GenerateAPIKeyRequest"
+                            }
+                        }
+                    },
+                    "required": true
+                },
+                "responses": {
+                    "200": {
+                        "description": "Successful Response",
+                        "content": {
+                            "application/json": {
+                                "schema": {
+                                    "$ref": "#/components/schemas/GenerateAPIKeyResponse"
+                                }
+                            }
+                        }
+                    },
+                    "422": {
+                        "description": "Validation Error",
+                        "content": {
+                            "application/json": {
+                                "schema": {
+                                    "$ref": "#/components/schemas/HTTPValidationError"
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        },
+        "/api/v1/auth/api-key/verify": {
+            "post": {
+                "tags": ["v1", "auth-iframe"],
+                "summary": "Verify Api Key And Login",
+                "description": "Verify API key and create JWT token for Iframe.\nStores token in secure HTTP-only cookie.",
+                "operationId": "verify_api_key_and_login_api_v1_auth_api_key_verify_post",
+                "parameters": [
+                    {
+                        "required": true,
+                        "schema": {
+                            "type": "string",
+                            "title": "Api Key"
+                        },
+                        "name": "api_key",
+                        "in": "query"
+                    }
+                ],
+                "responses": {
+                    "200": {
+                        "description": "Successful Response",
+                        "content": {
+                            "application/json": {
+                                "schema": {}
+                            }
+                        }
+                    },
+                    "422": {
+                        "description": "Validation Error",
+                        "content": {
+                            "application/json": {
+                                "schema": {
+                                    "$ref": "#/components/schemas/HTTPValidationError"
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        },
+        "/api/v1/auth/iframe/status": {
+            "get": {
+                "tags": ["v1", "auth-iframe"],
+                "summary": "Check Iframe Login Status",
+                "description": "Check if user is already logged in via Iframe.\nReturns user info if logged in.",
+                "operationId": "check_iframe_login_status_api_v1_auth_iframe_status_get",
+                "responses": {
+                    "200": {
+                        "description": "Successful Response",
+                        "content": {
+                            "application/json": {
+                                "schema": {}
+                            }
+                        }
+                    }
+                },
+                "security": [
+                    {
+                        "JWTBearer": []
+                    }
+                ]
+            }
+        },
+        "/api/v1/auth/whitelist": {
+            "get": {
+                "tags": ["v1", "auth-iframe"],
+                "summary": "Get Whitelist",
+                "description": "List all whitelist entries (Admin only)",
+                "operationId": "get_whitelist_api_v1_auth_whitelist_get",
+                "parameters": [
+                    {
+                        "required": false,
+                        "schema": {
+                            "type": "integer",
+                            "title": "Page",
+                            "default": 1
+                        },
+                        "name": "page",
+                        "in": "query"
+                    },
+                    {
+                        "required": false,
+                        "schema": {
+                            "type": "integer",
+                            "title": "Page Size",
+                            "default": 100
+                        },
+                        "name": "page_size",
+                        "in": "query"
+                    }
+                ],
+                "responses": {
+                    "200": {
+                        "description": "Successful Response",
+                        "content": {
+                            "application/json": {
+                                "schema": {}
+                            }
+                        }
+                    },
+                    "422": {
+                        "description": "Validation Error",
+                        "content": {
+                            "application/json": {
+                                "schema": {
+                                    "$ref": "#/components/schemas/HTTPValidationError"
+                                }
+                            }
+                        }
+                    }
+                },
+                "security": [
+                    {
+                        "JWTBearer": []
+                    }
+                ]
+            },
+            "post": {
+                "tags": ["v1", "auth-iframe"],
+                "summary": "Add Whitelist",
+                "description": "Add new domain to whitelist (Admin only)",
+                "operationId": "add_whitelist_api_v1_auth_whitelist_post",
+                "requestBody": {
+                    "content": {
+                        "application/json": {
+                            "schema": {
+                                "$ref": "#/components/schemas/UpsertWhitelist"
+                            }
+                        }
+                    },
+                    "required": true
+                },
+                "responses": {
+                    "200": {
+                        "description": "Successful Response",
+                        "content": {
+                            "application/json": {
+                                "schema": {}
+                            }
+                        }
+                    },
+                    "422": {
+                        "description": "Validation Error",
+                        "content": {
+                            "application/json": {
+                                "schema": {
+                                    "$ref": "#/components/schemas/HTTPValidationError"
+                                }
+                            }
+                        }
+                    }
+                },
+                "security": [
+                    {
+                        "JWTBearer": []
+                    }
+                ]
+            }
+        },
+        "/api/v1/auth/whitelist/{whitelist_id}": {
+            "delete": {
+                "tags": ["v1", "auth-iframe"],
+                "summary": "Delete Whitelist",
+                "description": "Delete whitelist entry (Admin only)",
+                "operationId": "delete_whitelist_api_v1_auth_whitelist__whitelist_id__delete",
+                "parameters": [
+                    {
+                        "required": true,
+                        "schema": {
+                            "type": "integer",
+                            "title": "Whitelist Id"
+                        },
+                        "name": "whitelist_id",
+                        "in": "path"
+                    }
+                ],
+                "responses": {
+                    "200": {
+                        "description": "Successful Response",
+                        "content": {
+                            "application/json": {
+                                "schema": {}
+                            }
+                        }
+                    },
+                    "422": {
+                        "description": "Validation Error",
+                        "content": {
+                            "application/json": {
+                                "schema": {
+                                    "$ref": "#/components/schemas/HTTPValidationError"
+                                }
+                            }
+                        }
+                    }
+                },
+                "security": [
+                    {
+                        "JWTBearer": []
+                    }
+                ]
+            },
+            "patch": {
+                "tags": ["v1", "auth-iframe"],
+                "summary": "Update Whitelist",
+                "description": "Update whitelist entry (Admin only)",
+                "operationId": "update_whitelist_api_v1_auth_whitelist__whitelist_id__patch",
+                "parameters": [
+                    {
+                        "required": true,
+                        "schema": {
+                            "type": "integer",
+                            "title": "Whitelist Id"
+                        },
+                        "name": "whitelist_id",
+                        "in": "path"
+                    }
+                ],
+                "requestBody": {
+                    "content": {
+                        "application/json": {
+                            "schema": {
+                                "$ref": "#/components/schemas/UpsertWhitelist"
+                            }
+                        }
+                    },
+                    "required": true
+                },
+                "responses": {
+                    "200": {
+                        "description": "Successful Response",
+                        "content": {
+                            "application/json": {
+                                "schema": {}
+                            }
+                        }
+                    },
+                    "422": {
+                        "description": "Validation Error",
+                        "content": {
+                            "application/json": {
+                                "schema": {
+                                    "$ref": "#/components/schemas/HTTPValidationError"
+                                }
+                            }
+                        }
+                    }
+                },
+                "security": [
+                    {
+                        "JWTBearer": []
+                    }
+                ]
+            }
         }
     },
     "components": {
@@ -1842,10 +2180,13 @@
                         },
                         "type": "array",
                         "title": "Data"
+                    },
+                    "pagination": {
+                        "$ref": "#/components/schemas/PaginationDTO"
                     }
                 },
                 "type": "object",
-                "required": ["data"],
+                "required": ["data", "pagination"],
                 "title": "DocumentListResponse",
                 "description": "GET /courses/{course_id}/documents — 200 response wrapper."
             },
@@ -1970,6 +2311,63 @@
                 "type": "object",
                 "title": "FindUserResult"
             },
+            "GenerateAPIKeyRequest": {
+                "properties": {
+                    "email": {
+                        "type": "string",
+                        "title": "Email"
+                    },
+                    "username": {
+                        "type": "string",
+                        "title": "Username"
+                    },
+                    "phone": {
+                        "type": "string",
+                        "title": "Phone"
+                    },
+                    "name": {
+                        "type": "string",
+                        "title": "Name"
+                    },
+                    "identity_number": {
+                        "type": "string",
+                        "title": "Identity Number"
+                    },
+                    "source_domain": {
+                        "type": "string",
+                        "title": "Source Domain"
+                    },
+                    "role": {
+                        "$ref": "#/components/schemas/app__schema__auth_schema__Role"
+                    }
+                },
+                "type": "object",
+                "required": [
+                    "email",
+                    "username",
+                    "phone",
+                    "name",
+                    "identity_number",
+                    "source_domain",
+                    "role"
+                ],
+                "title": "GenerateAPIKeyRequest"
+            },
+            "GenerateAPIKeyResponse": {
+                "properties": {
+                    "api_key": {
+                        "type": "string",
+                        "title": "Api Key"
+                    },
+                    "message": {
+                        "type": "string",
+                        "title": "Message"
+                    }
+                },
+                "type": "object",
+                "required": ["api_key", "message"],
+                "title": "GenerateAPIKeyResponse"
+            },
             "HTTPValidationError": {
                 "properties": {
                     "detail": {
@@ -2443,6 +2841,30 @@
                 "type": "object",
                 "title": "UpsertUser"
             },
+            "UpsertWhitelist": {
+                "properties": {
+                    "source_type": {
+                        "type": "string",
+                        "title": "Source Type"
+                    },
+                    "value": {
+                        "type": "string",
+                        "title": "Value"
+                    },
+                    "description": {
+                        "type": "string",
+                        "title": "Description"
+                    },
+                    "is_active": {
+                        "type": "boolean",
+                        "title": "Is Active",
+                        "default": true
+                    }
+                },
+                "type": "object",
+                "required": ["source_type", "value"],
+                "title": "UpsertWhitelist"
+            },
             "User": {
                 "properties": {
                     "email": {