fix admin login

Author: johnnzhou

.env

@@ -1,3 +1,3 @@
 VITE_PORT=3000
-VITE_ENV_API_URL=127.0.0.1
+VITE_ENV_API_URL=localhost
 EXPOSED_PORT=3002

models/ccn-coverage-models

@@ -16,6 +16,7 @@ const theme = createTheme();
 
 export default function Login() {
   const [open, setOpen] = React.useState(false);
+  const [errorMessage, setErrorMessage] = React.useState("");
   const handleClose = (
     event?: React.SyntheticEvent | Event,
     reason?: string,
@@ -52,12 +53,14 @@ export default function Login() {
       .then(res => {
         const { data, error } = res;
         if (!data || error) {
-          console.log(`Unable to login: ${error}`);
+          console.log(`Unable to login: ${error.error}`);
+          setErrorMessage(error.error);
           setOpen(true);
           return;
         }
 
-        if (data === 'success') {
+        if (data.result === 'success') {
+          console.log('Login successful');
           window.open('/admin/users', '_self');
         } else {
           setOpen(true);
@@ -133,7 +136,7 @@ export default function Login() {
                 severity='error'
                 sx={{ width: '100%' }}
               >
-                Incorrect username or password
+                Incorrect username or password: {errorMessage}
               </Alert>
             </Snackbar>
           </Box>

src/admin/Login.tsx

@@ -847,24 +847,34 @@ export interface paths {
             [name: string]: unknown;
           };
           content: {
-            'text/plain': string;
+            'application/json': {
+              /** @example success */
+              result: string;
+            };
           };
         };
-        /** @description Redirect to success or failure page */
-        302: {
+        /** @description Authentication failed */
+        401: {
           headers: {
-            Location?: string;
             [name: string]: unknown;
           };
-          content?: never;
+          content: {
+            'application/json': {
+              /** @example Invalid credentials */
+              error: string;
+            };
+          };
         };
-        /** @description Authentication failed */
-        401: {
+        /** @description Server error */
+        500: {
           headers: {
             [name: string]: unknown;
           };
           content: {
-            'text/plain': string;
+            'application/json': {
+              /** @example Failed to establish session */
+              error: string;
+            };
           };
         };
       };

src/types/api.d.ts

@@ -2,4 +2,4 @@ import createClient from 'openapi-fetch';
 import type { paths } from '../types/api';
 import { API_URL } from './config';
 
-export const apiClient = createClient<paths>({ baseUrl: API_URL });
+export const apiClient = createClient<paths>({ baseUrl: API_URL, credentials: 'include' });

src/utils/fetch.ts

@@ -13,6 +13,43 @@ export default defineConfig({
   server: {
     host: true,
     port: 3002,
+    cors: true,
+    proxy: {
+      '/api': {
+        target: 'http://localhost:3000',
+        changeOrigin: true,
+        secure: false,
+        rewrite: (path) => path.replace(/^\/api/, ''),
+        configure: (proxy, options) => {
+          proxy.on('error', (err, req, res) => {
+            console.log('proxy error', err);
+          });
+          proxy.on('proxyReq', (proxyReq, req, res) => {
+            console.log('Sending Request to the Target:', req.method, req.url);
+          });
+          proxy.on('proxyRes', (proxyRes, req, res) => {
+            console.log('Received Response from the Target:', proxyRes.statusCode);
+          });
+        },
+      },
+      '/secure': {
+        target: 'http://localhost:3000',
+        changeOrigin: true,
+        secure: false,
+        rewrite: (path) => path.replace(/^\/secure/, ''),
+        configure: (proxy, options) => {
+          proxy.on('error', (err, req, res) => {
+            console.log('proxy error', err);
+          });
+          proxy.on('proxyReq', (proxyReq, req, res) => {
+            console.log('Sending Request to the Target:', req.method, req.url);
+          });
+          proxy.on('proxyRes', (proxyRes, req, res) => {
+            console.log('Received Response from the Target:', proxyRes.statusCode);
+          });
+        },
+      }
+    }
   },
   publicDir: 'public',
   build: {