From 66a391371682639b9fcf5f6b75fbbf93ec35f4ca Mon Sep 17 00:00:00 2001
From: maria papanagiotou <mariapapanagiwtou@gmail.com>
Date: Thu, 25 Jan 2024 02:15:01 +0200
Subject: [PATCH] add interface for record color theme, try training slash

---
 ui/next.config.js               |  5 +++--
 ui/src/pages/pet/[id]/index.tsx | 10 ++++++++--
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/ui/next.config.js b/ui/next.config.js
index e9bbbb5..38a4167 100644
--- a/ui/next.config.js
+++ b/ui/next.config.js
@@ -4,12 +4,13 @@ const nextConfig = {
     // reactStrictMode: true,
     env: {
         // apiUrl: "http://localhost:8080/api",
-        // apiUrl: "https://mypetjournal-lqkz3.ondigitalocean.app/api",
-        apiUrl: "/api",
+        apiUrl: "https://mypetjournal-lqkz3.ondigitalocean.app/api",
+        // apiUrl: "/api",
     },
     images: {
         unoptimized: true,
     },
+    trailingSlash: true,
     distDir: "build",
 }
 
diff --git a/ui/src/pages/pet/[id]/index.tsx b/ui/src/pages/pet/[id]/index.tsx
index c41f88a..8891b8b 100644
--- a/ui/src/pages/pet/[id]/index.tsx
+++ b/ui/src/pages/pet/[id]/index.tsx
@@ -63,6 +63,12 @@ interface RecordColor {
     backgroundColor: string
 }
 
+interface RecordTheme {
+    border: string
+    icon: string
+    background: string
+}
+
 interface PetState {
     token?: string
     pet?: Pet
@@ -528,7 +534,7 @@ class PetPage extends BaseComponent<PetProps, PetState> {
         )
     }
 
-    private getRecordTypeColors = (type: string) => {
+    private getRecordTypeColors = (type: string): RecordTheme => {
         let typeColor = {border: "border-indigo-600", icon: "text-indigo-300", background: "bg-indigo-600"}
         if (type === RecordType.REMINDER) {
             typeColor = {border: "border-teal-600", icon: "text-teal-300", background: "bg-teal-600"}
@@ -538,7 +544,7 @@ class PetPage extends BaseComponent<PetProps, PetState> {
         return typeColor
     }
 
-    private recordEntry = (r: Record, color: any) => {
+    private recordEntry = (r: Record, color: RecordTheme) => {
         const upcoming = r.administeredBy === undefined
         return (
             <div