From b2d1fc7933660ecf5a10f91a4d33942af5cfea78 Mon Sep 17 00:00:00 2001
From: Petr Utkin <103509683+PetruccioU@users.noreply.github.com>
Date: Fri, 31 Jan 2025 10:12:19 +1300
Subject: [PATCH 1/7] Petr added personal info #56 (#77)

close #56
---
 src/6_shared/ui/footer/petr/Petr.tsx | 23 ++++++++++++++++++++++-
 1 file changed, 22 insertions(+), 1 deletion(-)

diff --git a/src/6_shared/ui/footer/petr/Petr.tsx b/src/6_shared/ui/footer/petr/Petr.tsx
index fdeec2e..772755c 100644
--- a/src/6_shared/ui/footer/petr/Petr.tsx
+++ b/src/6_shared/ui/footer/petr/Petr.tsx
@@ -1,7 +1,28 @@
+import { Link } from "react-router-dom";
+
 export function Petr() {
   return (
     <div className='flex items-center justify-center mt-2'>
-      <p>Petr Utkin</p>
+      <Link
+        to='mailto:petr.utkin2022@gmail.com'
+        className='mr-2'
+      >
+        Petr Utkin
+      </Link>
+      <Link to='https://www.linkedin.com/in/petr-utkin/'>
+        <img
+          src='https://logo.clearbit.com/linkedin.com'
+          alt='LinkedIn'
+          className='size-5 mr-2'
+        />
+      </Link>
+      <Link to='https://github.com/PetruccioU'>
+        <img
+          src='https://logo.clearbit.com/github.com'
+          alt='GitHub'
+          className='size-5 mr-2'
+        />
+      </Link>
     </div>
   )
 }
\ No newline at end of file

From b237596b32c19bf9d8b09564f3e9868d1eeab1a1 Mon Sep 17 00:00:00 2001
From: Bonsung Koo <developer@bonsung.me>
Date: Fri, 31 Jan 2025 10:17:26 +1300
Subject: [PATCH 2/7] Personal information is changed #57 (#79)

---
 src/6_shared/ui/footer/bonsung/Bonsung.tsx | 17 +++++------------
 1 file changed, 5 insertions(+), 12 deletions(-)

diff --git a/src/6_shared/ui/footer/bonsung/Bonsung.tsx b/src/6_shared/ui/footer/bonsung/Bonsung.tsx
index 0fb9f84..7d0f495 100644
--- a/src/6_shared/ui/footer/bonsung/Bonsung.tsx
+++ b/src/6_shared/ui/footer/bonsung/Bonsung.tsx
@@ -4,11 +4,11 @@ export function Bonsung() {
   return (
     <div className='flex items-center justify-center mt-2'>
       <Link
-        to='mailto:developer@bonsung.me'
-        className='mr-2'
-      >
-        Bonsung Koo
-      </Link>
+          to='https://bonsung.me'
+          className='mr-2 underline'
+        >
+          Bonsung Koo
+        </Link>
       <Link to='https://www.linkedin.com/in/bonsung-koo/'>
         <img
           src='https://logo.clearbit.com/linkedin.com'
@@ -23,13 +23,6 @@ export function Bonsung() {
           className='size-5 mr-2'
         />
       </Link>
-      <Link to='https://bonsung.me'>
-        <img
-          src='https://logo.clearbit.com/bonsung.me'
-          alt='On The Code'
-          className='size-5 mr-2'
-        />
-      </Link>
     </div>
   )
 }
\ No newline at end of file

From 0596edf8fe0bdfbc55375299d09eba05979b86a5 Mon Sep 17 00:00:00 2001
From: Petr Utkin <103509683+PetruccioU@users.noreply.github.com>
Date: Fri, 31 Jan 2025 11:07:24 +1300
Subject: [PATCH 3/7] ConfirmationModal updated to have a Bearer token in
 getImage request header #78 (#80)

close #78
---
 .../dashboard/ui/components/ConfirmationModal.tsx     | 11 ++++++++---
 .../dashboard/ui/components/SurchargesList.tsx        |  3 +++
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/3_widgets/dashboard/ui/components/ConfirmationModal.tsx b/src/3_widgets/dashboard/ui/components/ConfirmationModal.tsx
index cfc9579..4576478 100644
--- a/src/3_widgets/dashboard/ui/components/ConfirmationModal.tsx
+++ b/src/3_widgets/dashboard/ui/components/ConfirmationModal.tsx
@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { Button, TextField, Dialog, DialogTitle, DialogContent, DialogActions, CircularProgress, Box } from '@mui/material';
+import { useAuth } from "@shared/model";
 
 interface Props {
   status: string
@@ -15,6 +16,7 @@ const ConfirmationModal: React.FC<Props> = ({status, surchargeId, imageName, isO
   const [newTotalAmount, setNewTotalAmount] = useState('');
   const [imageBase64, setImageBase64] = useState<string | null>(null);
   const [loadingImage, setLoadingImage] = useState(false);
+  const { user } = useAuth();
 
   useEffect(() => {
     if (isOpen && imageName) {
@@ -22,17 +24,20 @@ const ConfirmationModal: React.FC<Props> = ({status, surchargeId, imageName, isO
         setLoadingImage(true);
         try {
           const baseURL = import.meta.env.VITE_BASE_URL;
-          const response = await fetch(`${baseURL}/admin/image?image=${imageName}`, {  // TODO: api -> admin
+          const token = user ? await user.getIdToken() : "";
+
+          const response = await fetch(`${baseURL}/admin/image?image=${imageName}`, {
             method: 'GET',
             headers: {
               Accept: 'application/json',
               'Content-Type': 'application/json',
+              Authorization: `Bearer ${token}`,
             },
           });
 
           if (response.ok) {
             const data = await response.json();
-            setImageBase64(data.image); // Assuming `data.image` contains the Base64 string
+            setImageBase64(data.image); 
           } else {
             console.error('Error fetching image:', response.statusText);
             setImageBase64(null);
@@ -49,7 +54,7 @@ const ConfirmationModal: React.FC<Props> = ({status, surchargeId, imageName, isO
     } else {
       setImageBase64(null);
     }
-  }, [isOpen, imageName]);
+  }, [user, isOpen, imageName]);
 
   const handleInputChange = (
     e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
diff --git a/src/3_widgets/dashboard/ui/components/SurchargesList.tsx b/src/3_widgets/dashboard/ui/components/SurchargesList.tsx
index 55e780c..a9061b7 100644
--- a/src/3_widgets/dashboard/ui/components/SurchargesList.tsx
+++ b/src/3_widgets/dashboard/ui/components/SurchargesList.tsx
@@ -30,6 +30,9 @@ const SurhcargesList: React.FC<SurhcargeListProps> = ({ searchedSurcharges, load
 		setSelectedSurcharge(null);
 	};
 
+    // useEffect(() => {
+    // }, [user]);
+
 	const confirmSurcharge = async (
 		id: string,
 		action: string,

From 7bbf3907b2863d6f9a57e41a035e5b8872941164 Mon Sep 17 00:00:00 2001
From: Petr Utkin <103509683+PetruccioU@users.noreply.github.com>
Date: Mon, 3 Feb 2025 09:29:00 +1300
Subject: [PATCH 4/7] 81 fix totalamount and surchargeamount in
 confirmationmodal #81 (#82)

* totalAmount and surchargeAmount sent to ConfirmationModal to fill the placeholders, text inputs labels shrinked

* put the status component in the box

* buttons colours changed

* header deleted

* warning message added when "newSurchargeAmount" value is bigger that "newTotalAmount", but improvement needed

* 'AUTO_GENERATED', 'REJECTED' added to frontend enum
---
 .../ui/components/ConfirmationModal.tsx       | 119 +++++++++++-------
 .../ui/components/SurchargesList.tsx          |  39 +++---
 .../surcharges/api/SurchargesStatusDTO.ts     |   4 +-
 3 files changed, 102 insertions(+), 60 deletions(-)

diff --git a/src/3_widgets/dashboard/ui/components/ConfirmationModal.tsx b/src/3_widgets/dashboard/ui/components/ConfirmationModal.tsx
index 4576478..7c4617d 100644
--- a/src/3_widgets/dashboard/ui/components/ConfirmationModal.tsx
+++ b/src/3_widgets/dashboard/ui/components/ConfirmationModal.tsx
@@ -3,6 +3,8 @@ import { Button, TextField, Dialog, DialogTitle, DialogContent, DialogActions, C
 import { useAuth } from "@shared/model";
 
 interface Props {
+  totalAmount: number
+  surchargeAmount: number
   status: string
   surchargeId: string;
   imageName: string | undefined;
@@ -11,11 +13,12 @@ interface Props {
   onConfirm: (surchargeId: string, action: string, newSurchargeAmount: number | undefined, newTotalAmount: number | undefined) => Promise<void>;
 }
 
-const ConfirmationModal: React.FC<Props> = ({status, surchargeId, imageName, isOpen, onClose, onConfirm }) => {
+const ConfirmationModal: React.FC<Props> = ({totalAmount, surchargeAmount, status, surchargeId, imageName, isOpen, onClose, onConfirm }) => {
   const [newSurchargeAmount, setNewSurchargeAmount] = useState('');
   const [newTotalAmount, setNewTotalAmount] = useState('');
   const [imageBase64, setImageBase64] = useState<string | null>(null);
   const [loadingImage, setLoadingImage] = useState(false);
+  const [isTotalBiggerThatnSurcharge, setIsTotalBiggerThatnSurcharge] = useState(true);
   const { user } = useAuth();
 
   useEffect(() => {
@@ -56,62 +59,84 @@ const ConfirmationModal: React.FC<Props> = ({status, surchargeId, imageName, isO
     }
   }, [user, isOpen, imageName]);
 
+  const checkIfTotalBiggerThenSurcharge = (
+    newTotalAmount: string, newSurchargeAmount: string  ) => {
+    if(Number(newTotalAmount) < Number(newSurchargeAmount)){setIsTotalBiggerThatnSurcharge(false)}
+    else {setIsTotalBiggerThatnSurcharge(true)}
+  }
+
   const handleInputChange = (
     e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
-    setFunction: (value: React.SetStateAction<string>) => void
+    setFunction: (value: React.SetStateAction<string>) => void,
   ) => {
     setFunction(e.target.value);
+    checkIfTotalBiggerThenSurcharge(newTotalAmount, newSurchargeAmount)
   };
 
   function renderContent() {
-    if (status === "REPORTED") {
-      return (
-        <>
+    if (isTotalBiggerThatnSurcharge){
+      if (status === "REPORTED") {
+        return (
+          <>
+            <Button
+              onClick={() =>
+                onConfirm(surchargeId, "CONFIRM", Number(newSurchargeAmount), Number(newTotalAmount))
+              }
+              color="success"
+              variant="contained"
+            >
+              Confirm Surcharge
+            </Button>
+            <Button
+              onClick={() =>
+                onConfirm(surchargeId, "REJECT", Number(newSurchargeAmount), Number(newTotalAmount))
+              }
+              color="error"
+              variant="contained"
+            >
+              Reject Surcharge
+            </Button>
+          </>
+        );
+      } else if (status === "CONFIRMED") {
+        return (
           <Button
             onClick={() =>
-              onConfirm(surchargeId, "CONFIRM", Number(newSurchargeAmount), Number(newTotalAmount))
+              onConfirm(surchargeId, "REJECT", Number(newSurchargeAmount), Number(newTotalAmount))
             }
-            color="primary"
+            color="error"
             variant="contained"
           >
-            Confirm Surcharge
+            Reject Surcharge
           </Button>
+        );
+      } else if (status === "REJECTED") {
+        return (
           <Button
             onClick={() =>
-              onConfirm(surchargeId, "REJECT", Number(newSurchargeAmount), Number(newTotalAmount))
+              onConfirm(surchargeId, "CONFIRM", Number(newSurchargeAmount), Number(newTotalAmount))
             }
-            color="secondary"
+            color="success"
             variant="contained"
           >
-            Reject Surcharge
+            Confirm Surcharge
           </Button>
-        </>
-      );
-    } else if (status === "CONFIRMED") {
-      return (
-        <Button
-          onClick={() =>
-            onConfirm(surchargeId, "REJECT", Number(newSurchargeAmount), Number(newTotalAmount))
-          }
-          color="secondary"
-          variant="contained"
-        >
-          Reject Surcharge
-        </Button>
-      );
-    } else if (status === "REJECTED") {
+        );
+      }
+    } else {
       return (
-        <Button
-          onClick={() =>
-            onConfirm(surchargeId, "CONFIRM", Number(newSurchargeAmount), Number(newTotalAmount))
-          }
-          color="primary"
-          variant="contained"
-        >
-          Confirm Surcharge
-        </Button>
-      );
+        <Box component="span"
+        sx={{
+          backgroundColor: 'red',
+          color: 'white', // Text color for contrast
+          padding: '4px 8px', // Padding for the badge
+          borderRadius: '8px', // Rounded corners
+          fontWeight: 'bold',
+          display: 'inline-block', // Keeps the box inline
+        }}>Probably a mistake, "newSurchargeAmount" value is bigger that "newTotalAmount", please correct </Box>
+      )
     }
+    
   }
   
 
@@ -133,26 +158,34 @@ const ConfirmationModal: React.FC<Props> = ({status, surchargeId, imageName, isO
           )}
         </Box>
         <TextField
-          label="New Surcharge Amount"
+          label="New Total Amount"
+          placeholder={totalAmount.toString()}
           type="number"
-          value={newSurchargeAmount}
-          onChange={(e) => handleInputChange(e, setNewSurchargeAmount)}
+          value={newTotalAmount}
+          onChange={(e) => handleInputChange(e, setNewTotalAmount)}
           fullWidth
           variant="outlined"
           margin="normal"
+          slotProps={{
+            inputLabel: { shrink: true }
+          }}
         />
         <TextField
-          label="New Total Amount"
+          label="New Surcharge Amount"
+          placeholder={surchargeAmount.toString()}
           type="number"
-          value={newTotalAmount}
-          onChange={(e) => handleInputChange(e, setNewTotalAmount)}
+          value={newSurchargeAmount}
+          onChange={(e) => handleInputChange(e, setNewSurchargeAmount)}
           fullWidth
           variant="outlined"
           margin="normal"
+          slotProps={{
+            inputLabel: { shrink: true }
+          }}
         />
       </DialogContent>
       <DialogActions>
-        <Button onClick={onClose} color="secondary" variant="outlined">
+        <Button onClick={onClose} color="primary" variant="outlined">
           Close
         </Button>
         {renderContent()}
diff --git a/src/3_widgets/dashboard/ui/components/SurchargesList.tsx b/src/3_widgets/dashboard/ui/components/SurchargesList.tsx
index a9061b7..0d9c724 100644
--- a/src/3_widgets/dashboard/ui/components/SurchargesList.tsx
+++ b/src/3_widgets/dashboard/ui/components/SurchargesList.tsx
@@ -107,7 +107,6 @@ const SurhcargesList: React.FC<SurhcargeListProps> = ({ searchedSurcharges, load
           <p className="text-red-500">Error: {error || errorProp}</p>
         ) : (
           <div>
-            <h2 className="text-lg font-bold mb-4">Surcharges:</h2>
             {searchedSurcharges.length === 0 ? (
               <p>No surcharge records match the selected filter.</p>
             ) : (
@@ -131,31 +130,37 @@ const SurhcargesList: React.FC<SurhcargeListProps> = ({ searchedSurcharges, load
                         ).toLocaleDateString()}
                       </p>
                       <p>
-                        <strong>Surcharge Amount:</strong> $
-                        {surcharge.surchargeAmount}
+                        <strong>Total Amount:</strong> ${surcharge.totalAmount}
                       </p>
                       <p>
-                        <strong>Total Amount:</strong> ${surcharge.totalAmount}
+                        <strong>Surcharge Amount:</strong> $
+                        {surcharge.surchargeAmount}
                       </p>
                       <p>
                         <strong>Status:</strong>{' '}
-                          <span
-                            style={{
-                              color:
-                                surcharge.surchargeStatus === 'CONFIRMED'
-                                  ? 'lightgreen'
+                        <Box
+                          component="span"
+                          sx={{
+                            backgroundColor:
+                              surcharge.surchargeStatus === 'CONFIRMED'
+                                ? 'lightgreen'
                                 : surcharge.surchargeStatus === 'REPORTED'
-                                  ? 'gray'
+                                ? 'blue'
                                 : surcharge.surchargeStatus === 'REJECTED'
-                                  ? 'red'  
-                                  : 'yellow',
-                            }}
-                          >
+                                ? 'red'
+                                : 'yellow',
+                            color: 'white', // Text color for contrast
+                            padding: '4px 8px', // Padding for the badge
+                            borderRadius: '8px', // Rounded corners
+                            fontWeight: 'bold',
+                            display: 'inline-block', // Keeps the box inline
+                          }}
+                        >
                           {surcharge.surchargeStatus}
-                        </span>
+                        </Box>
                       </p>
                       <button
-                        className="px-4 py-2 bg-blue-500 text-white rounded"
+                        className="px-4 py-2 bg-purple-500 text-white rounded"
                         onClick={() => openConfirmationModal(surcharge)}
                       >
                         Process surcharge
@@ -170,6 +175,8 @@ const SurhcargesList: React.FC<SurhcargeListProps> = ({ searchedSurcharges, load
       </div>
       {selectedSurcharge && (
         <ConfirmationModal
+          totalAmount={selectedSurcharge.totalAmount}
+          surchargeAmount={selectedSurcharge.surchargeAmount}
           status={selectedSurcharge.surchargeStatus}
           surchargeId={selectedSurcharge.id}
           imageName={selectedSurcharge.image}
diff --git a/src/5_entities/surcharges/api/SurchargesStatusDTO.ts b/src/5_entities/surcharges/api/SurchargesStatusDTO.ts
index 3593feb..7263a7e 100644
--- a/src/5_entities/surcharges/api/SurchargesStatusDTO.ts
+++ b/src/5_entities/surcharges/api/SurchargesStatusDTO.ts
@@ -1,5 +1,7 @@
 export enum SurchargesStatusDTO {
   CONFIRMED = 'CONFIRMED',
   REPORTED = 'REPORTED',
-  UNKNOWN = 'UNKNOWN'
+  UNKNOWN = 'UNKNOWN',
+  AUTO_GENERATED = 'AUTO_GENERATED',
+  REJECTED = 'REJECTED'
 }
\ No newline at end of file

From e7c207eadc957c5c885376f496e6cff3fb35d8bf Mon Sep 17 00:00:00 2001
From: Bonsung Koo <developer@bonsung.me>
Date: Mon, 3 Feb 2025 10:26:28 +1300
Subject: [PATCH 5/7] The `AUTO_GENERATED` surcharge status is handled in
 Result and Place Detail pages. (#85)

---
 src/3_widgets/detail/api/GetPlaceDetail.ts    |  6 ++--
 .../detail/model/usePlaceViewModel.ts         | 18 +++++-----
 .../surchargeInformation/SurchargesDetail.tsx | 13 +++++--
 .../model/viewmodels/useReportViewModel.ts    | 35 ++-----------------
 src/3_widgets/report/ui/Report.tsx            |  4 +--
 src/3_widgets/results/api/GetPlaces.ts        | 14 +++++---
 .../results/model/usePlaceListViewModel.ts    | 14 ++++----
 src/3_widgets/results/ui/Results.tsx          |  3 +-
 .../results/ui/placelist/PlaceItem.tsx        | 12 ++++---
 .../surcharges/model/SurchargesStatusModel.ts |  2 ++
 .../surcharges/ui/SurchargesStatusUI.ts       |  1 +
 src/6_shared/ui/index.ts                      |  1 +
 .../ui/surchargeStatus/AutoGenerated.tsx      |  9 +++++
 .../ui/surchargeStatus/help/StatusHelp.tsx    |  5 +++
 14 files changed, 74 insertions(+), 63 deletions(-)
 create mode 100644 src/6_shared/ui/surchargeStatus/AutoGenerated.tsx

diff --git a/src/3_widgets/detail/api/GetPlaceDetail.ts b/src/3_widgets/detail/api/GetPlaceDetail.ts
index 001712d..2878c87 100644
--- a/src/3_widgets/detail/api/GetPlaceDetail.ts
+++ b/src/3_widgets/detail/api/GetPlaceDetail.ts
@@ -29,12 +29,14 @@ export async function GetPlaceDetail(id: string): Promise<PlaceDTO> {
 
   const surchargeStatus = () => {
     switch (data.surchargeStatus) {
-      case "UNKNOWN":
-        return SurchargesStatusDTO.UNKNOWN
       case "REPORTED":
         return SurchargesStatusDTO.REPORTED
       case "CONFIRMED":
         return SurchargesStatusDTO.CONFIRMED
+      case "AUTO_GENERATED":
+        return SurchargesStatusDTO.AUTO_GENERATED
+      case "REJECTED":
+        return SurchargesStatusDTO.REJECTED
       default:
         return SurchargesStatusDTO.UNKNOWN
     }
diff --git a/src/3_widgets/detail/model/usePlaceViewModel.ts b/src/3_widgets/detail/model/usePlaceViewModel.ts
index d0c2d5e..73b2b63 100644
--- a/src/3_widgets/detail/model/usePlaceViewModel.ts
+++ b/src/3_widgets/detail/model/usePlaceViewModel.ts
@@ -18,12 +18,14 @@ export const usePlaceViewModel = (placeId: string) => {
 
     const surchargesStatus = (): SurchargesStatusModel => {
       switch (useGetPlaceQueryData?.status) {
-        case SurchargesStatusDTO.CONFIRMED:
-          return SurchargesStatusModel.Confirmed
         case SurchargesStatusDTO.REPORTED:
           return SurchargesStatusModel.Reported
-        case SurchargesStatusDTO.UNKNOWN:
-          return SurchargesStatusModel.Unknown
+        case SurchargesStatusDTO.CONFIRMED:
+          return SurchargesStatusModel.Confirmed
+        case SurchargesStatusDTO.AUTO_GENERATED:
+          return SurchargesStatusModel.AutoGenerated
+        case SurchargesStatusDTO.REJECTED:
+          return SurchargesStatusModel.Rejected
         default:
           return SurchargesStatusModel.Unknown
       }
@@ -61,12 +63,12 @@ export const usePlaceViewModel = (placeId: string) => {
 
     const surchargesStatus = (): SurchargesStatusUI => {
       switch (placeModel.surcharges.status) {
-        case SurchargesStatusModel.Confirmed:
-          return SurchargesStatusUI.Confirmed
         case SurchargesStatusModel.Reported:
           return SurchargesStatusUI.Reported
-        case SurchargesStatusModel.Unknown:
-          return SurchargesStatusUI.Unknown
+        case SurchargesStatusModel.Confirmed:
+          return SurchargesStatusUI.Confirmed
+        case SurchargesStatusModel.AutoGenerated:
+          return SurchargesStatusUI.AutoGenerated
         default:
           return SurchargesStatusUI.Unknown
       }
diff --git a/src/3_widgets/detail/ui/components/surchargeInformation/SurchargesDetail.tsx b/src/3_widgets/detail/ui/components/surchargeInformation/SurchargesDetail.tsx
index 9ac96ca..e158688 100644
--- a/src/3_widgets/detail/ui/components/surchargeInformation/SurchargesDetail.tsx
+++ b/src/3_widgets/detail/ui/components/surchargeInformation/SurchargesDetail.tsx
@@ -1,5 +1,5 @@
 import { SurchargesUI, SurchargesStatusUI } from "@entities/surcharges"
-import { Confirmed, Reported, Unknown, StatusHelp } from '@shared/ui'
+import { Confirmed, Reported, Unknown, StatusHelp, AutoGenerated } from '@shared/ui'
 import { ReportedDate } from "./dates/ReportedDate"
 import { SurchargeRate } from "./rates/SurchargeRate"
 import { ReportButton } from "./buttons/ReportButton"
@@ -21,13 +21,20 @@ export function SurchargesDetail(props: SurchargesDetailProps) {
         return <Confirmed />
       case SurchargesStatusUI.Reported:
         return <Reported />
+      case SurchargesStatusUI.AutoGenerated:
+        return <AutoGenerated />
       case SurchargesStatusUI.Unknown:
         return <Unknown />
     }
   }
 
   function Rate() {
-    if (!props.surchargesUI.rate) {
+
+    if (props.surchargesUI.status === SurchargesStatusUI.Unknown) {
+      return null
+    }
+
+    if (props.surchargesUI.rate === undefined) {
       return null
     }
 
@@ -36,7 +43,7 @@ export function SurchargesDetail(props: SurchargesDetailProps) {
 
   function Report() {
     switch (props.surchargesUI.status) {
-      case SurchargesStatusUI.Confirmed:
+      case SurchargesStatusUI.Confirmed || SurchargesStatusUI.AutoGenerated:
         return <ReportButton message='Something wrong?' onClickToReport={onClickToReport} />
       case SurchargesStatusUI.Reported:
         return null
diff --git a/src/3_widgets/report/model/viewmodels/useReportViewModel.ts b/src/3_widgets/report/model/viewmodels/useReportViewModel.ts
index f93f1dd..4618191 100644
--- a/src/3_widgets/report/model/viewmodels/useReportViewModel.ts
+++ b/src/3_widgets/report/model/viewmodels/useReportViewModel.ts
@@ -7,10 +7,6 @@ import { useUploadStore } from "../stores/useUploadStore"
 import { UploadSurchargeInformation } from "../usecases/UploadSurchargeInformation"
 
 import { PlaceModel } from "@entities/place"
-import { PlaceUI } from "@entities/place"
-
-import { MakeAddress } from "@shared/model"
-import { SurchargesStatusModel, SurchargesStatusUI } from "@entities/surcharges"
 
 export const useReportViewModel = (initialPlaceModel: PlaceModel) => {
 
@@ -37,33 +33,8 @@ export const useReportViewModel = (initialPlaceModel: PlaceModel) => {
   const _setIsUploaded = useUploadStore((state) => state.setIsUploaded)
   const setIsError = useUploadStore((state) => state.setIsError)
 
-  const placeUI = useMemo((): PlaceUI => {
-
-    const surchargeState = () => {
-      switch (_placeModel.surcharges.status) {
-        case SurchargesStatusModel.Unknown:
-          return SurchargesStatusUI.Unknown
-        case SurchargesStatusModel.Reported:
-          return SurchargesStatusUI.Reported
-        case SurchargesStatusModel.Confirmed:
-          return SurchargesStatusUI.Confirmed
-      }
-    }
-
-    return {
-      id: _placeModel.id,
-      name: _placeModel.displayName.text,
-      address: MakeAddress(_placeModel.addressComponents),
-      location: {
-        latitude: _placeModel.location.latitude,
-        longitude: _placeModel.location.longitude
-      },
-      surcharges: {
-        status: surchargeState(),
-        rate: _placeModel.surcharges.rate,
-        reportedDate: _placeModel.surcharges.reportedDate
-      }
-    }
+  const placeName = useMemo((): string => {
+    return _placeModel.displayName.text
   },
     [_placeModel]
   )
@@ -136,7 +107,7 @@ export const useReportViewModel = (initialPlaceModel: PlaceModel) => {
   }
 
   return {
-    placeUI,
+    placeName,
     totalAmount,
     surchargeAmount,
     isUploadImageButtonLoading,
diff --git a/src/3_widgets/report/ui/Report.tsx b/src/3_widgets/report/ui/Report.tsx
index e402cf6..7b45fab 100644
--- a/src/3_widgets/report/ui/Report.tsx
+++ b/src/3_widgets/report/ui/Report.tsx
@@ -59,7 +59,7 @@ export function Report() {
 
   return (
     <div className='ml-10 mr-10'>
-      <PageHeader placeName={amountsViewModel.placeUI.name} />
+      <PageHeader placeName={amountsViewModel.placeName} />
       <div className='flex flex-col items-center justify-center mt-4 gap-4'>
         <UploadButton
           loading={amountsViewModel.isUploadImageButtonLoading}
@@ -90,7 +90,7 @@ export function Report() {
       {/* When the uploading is successed. Show dimmed cover */}
       <UploadSuccess
         isUploaded={amountsViewModel.isUploaded}
-        placeName={amountsViewModel.placeUI.name}
+        placeName={amountsViewModel.placeName}
         goBack={handleBackToPlace}
       />
     </div>
diff --git a/src/3_widgets/results/api/GetPlaces.ts b/src/3_widgets/results/api/GetPlaces.ts
index d3441ed..dd82624 100644
--- a/src/3_widgets/results/api/GetPlaces.ts
+++ b/src/3_widgets/results/api/GetPlaces.ts
@@ -7,9 +7,9 @@ export async function GetPlaces(searchText: string, nextPageToken?: string): Pro
 
   const baseURL = import.meta.env.VITE_BASE_URL
 
-  const requestURL = nextPageToken && nextPageToken != '' 
-  ? `${baseURL}/api/places?searchText=${searchText}&nextPageToken=${nextPageToken}`
-  : `${baseURL}/api/places?searchText=${searchText}`
+  const requestURL = nextPageToken && nextPageToken != ''
+    ? `${baseURL}/api/places?searchText=${searchText}&nextPageToken=${nextPageToken}`
+    : `${baseURL}/api/places?searchText=${searchText}`
 
   const response = await fetch(requestURL, {
     method: 'GET'
@@ -21,17 +21,21 @@ export async function GetPlaces(searchText: string, nextPageToken?: string): Pro
 
   const data = await response.json()
 
+  console.log(data)
+
   return {
     places: data.places.map((place: any): PlaceDTO => {
 
       const surchargeStatus = () => {
         switch (place.surchargeStatus) {
-          case "UNKNOWN":
-            return SurchargesStatusDTO.UNKNOWN
           case "REPORTED":
             return SurchargesStatusDTO.REPORTED
           case "CONFIRMED":
             return SurchargesStatusDTO.CONFIRMED
+          case "AUTO_GENERATED":
+            return SurchargesStatusDTO.AUTO_GENERATED
+          case "REJECTED":
+            return SurchargesStatusDTO.REJECTED
           default:
             return SurchargesStatusDTO.UNKNOWN
         }
diff --git a/src/3_widgets/results/model/usePlaceListViewModel.ts b/src/3_widgets/results/model/usePlaceListViewModel.ts
index 108a836..006610e 100644
--- a/src/3_widgets/results/model/usePlaceListViewModel.ts
+++ b/src/3_widgets/results/model/usePlaceListViewModel.ts
@@ -17,11 +17,13 @@ export const usePlaceListViewModel = (searchText: string, nextPageToken?: string
 
       const status = () => {
         switch (place.status) {
-          case SurchargesStatusDTO.CONFIRMED:
-            return SurchargesStatusUI.Confirmed
           case SurchargesStatusDTO.REPORTED:
             return SurchargesStatusUI.Reported
-          case SurchargesStatusDTO.UNKNOWN:
+          case SurchargesStatusDTO.CONFIRMED:
+            return SurchargesStatusUI.Confirmed
+          case SurchargesStatusDTO.AUTO_GENERATED:
+            return SurchargesStatusUI.AutoGenerated
+          default:
             return SurchargesStatusUI.Unknown
         }
       }
@@ -41,9 +43,9 @@ export const usePlaceListViewModel = (searchText: string, nextPageToken?: string
         }
       }
     }) ?? []
-    },
-      [useGetPlacesQueryData]
-    )
+  },
+    [useGetPlacesQueryData]
+  )
 
   return { places, isFetching }
 }
\ No newline at end of file
diff --git a/src/3_widgets/results/ui/Results.tsx b/src/3_widgets/results/ui/Results.tsx
index 9526735..7aefc77 100644
--- a/src/3_widgets/results/ui/Results.tsx
+++ b/src/3_widgets/results/ui/Results.tsx
@@ -3,7 +3,7 @@ import { Link, useLocation, useNavigate } from 'react-router-dom'
 import { SearchBox } from '@features/searchBox'
 import { Footer, StatusHelp } from '@shared/ui'
 import { WrongAccess } from '@shared/ui'
-import { Confirmed, Reported } from '@shared/ui'
+import { Confirmed, Reported, AutoGenerated } from '@shared/ui'
 
 import { usePlaceListViewModel } from '../model/usePlaceListViewModel'
 import PlacesList from './placelist/PlaceList'
@@ -43,6 +43,7 @@ export function Results() {
       <div className='flex justify-center gap-2 mt-5'>
         <Confirmed />
         <Reported />
+        <AutoGenerated />
         <StatusHelp includingUnknown={false} />
       </div>
       <div>
diff --git a/src/3_widgets/results/ui/placelist/PlaceItem.tsx b/src/3_widgets/results/ui/placelist/PlaceItem.tsx
index 84d406f..d42e08e 100644
--- a/src/3_widgets/results/ui/placelist/PlaceItem.tsx
+++ b/src/3_widgets/results/ui/placelist/PlaceItem.tsx
@@ -32,14 +32,18 @@ function SurchargesBadge({ status, rate }: { status: SurchargesStatusUI, rate?:
     return null
   }
 
+  if (status === SurchargesStatusUI.Unknown) {
+    return null
+  }
+
   const backgroundColor = () => {
     switch (status) {
       case SurchargesStatusUI.Confirmed:
         return 'bg-green-300'
       case SurchargesStatusUI.Reported:
         return 'bg-blue-300'
-      case SurchargesStatusUI.Unknown:
-        return 'bg-red-300'
+      case SurchargesStatusUI.AutoGenerated:
+        return 'bg-yellow-300'
     }
   }
 
@@ -49,8 +53,8 @@ function SurchargesBadge({ status, rate }: { status: SurchargesStatusUI, rate?:
         return 'text-green-800'
       case SurchargesStatusUI.Reported:
         return 'text-blue-800'
-      case SurchargesStatusUI.Unknown:
-        return 'text-red-800'
+      case SurchargesStatusUI.AutoGenerated:
+        return 'text-yellow-800'
     }
   }
 
diff --git a/src/5_entities/surcharges/model/SurchargesStatusModel.ts b/src/5_entities/surcharges/model/SurchargesStatusModel.ts
index 193a661..d5792c4 100644
--- a/src/5_entities/surcharges/model/SurchargesStatusModel.ts
+++ b/src/5_entities/surcharges/model/SurchargesStatusModel.ts
@@ -1,5 +1,7 @@
 export enum SurchargesStatusModel {
   Confirmed,
   Reported,
+  AutoGenerated,
+  Rejected,
   Unknown,
 }
\ No newline at end of file
diff --git a/src/5_entities/surcharges/ui/SurchargesStatusUI.ts b/src/5_entities/surcharges/ui/SurchargesStatusUI.ts
index 38c6806..1c79841 100644
--- a/src/5_entities/surcharges/ui/SurchargesStatusUI.ts
+++ b/src/5_entities/surcharges/ui/SurchargesStatusUI.ts
@@ -1,5 +1,6 @@
 export enum SurchargesStatusUI {
   Confirmed,
   Reported,
+  AutoGenerated,
   Unknown,
 }
\ No newline at end of file
diff --git a/src/6_shared/ui/index.ts b/src/6_shared/ui/index.ts
index fa4470d..deb29a2 100644
--- a/src/6_shared/ui/index.ts
+++ b/src/6_shared/ui/index.ts
@@ -4,5 +4,6 @@ export { WrongAccess } from "./wrongAccess/WrongAccess"
 export { ErrorAlert } from "./errorAlert/ErrorAlert"
 export { Confirmed } from "./surchargeStatus/Confirmed"
 export { Reported } from "./surchargeStatus/Reported"
+export { AutoGenerated } from "./surchargeStatus/AutoGenerated"
 export { Unknown } from "./surchargeStatus/Unknown"
 export { StatusHelp } from "./surchargeStatus/help/StatusHelp"
\ No newline at end of file
diff --git a/src/6_shared/ui/surchargeStatus/AutoGenerated.tsx b/src/6_shared/ui/surchargeStatus/AutoGenerated.tsx
new file mode 100644
index 0000000..2bc8930
--- /dev/null
+++ b/src/6_shared/ui/surchargeStatus/AutoGenerated.tsx
@@ -0,0 +1,9 @@
+export function AutoGenerated() {
+  return (
+    <div className='flex items-center'>
+      <div className='rounded-lg bg-yellow-300 text-yellow-800'>
+        <p className='pl-2 pr-2 pt-1 pb-1'>Auto-Generated</p>
+      </div>
+    </div>
+  )
+}
\ No newline at end of file
diff --git a/src/6_shared/ui/surchargeStatus/help/StatusHelp.tsx b/src/6_shared/ui/surchargeStatus/help/StatusHelp.tsx
index 548753d..d8a683e 100644
--- a/src/6_shared/ui/surchargeStatus/help/StatusHelp.tsx
+++ b/src/6_shared/ui/surchargeStatus/help/StatusHelp.tsx
@@ -3,6 +3,7 @@ import { useMediaQuery } from "@mui/material"
 import { Tooltip } from "@mui/material"
 import { Confirmed } from "../Confirmed"
 import { Reported } from "../Reported"
+import { AutoGenerated } from "../AutoGenerated"
 import { Unknown } from "../Unknown"
 import HelpIcon from '@mui/icons-material/Help'
 
@@ -41,6 +42,10 @@ export function StatusHelp(props: StatusHelpProps) {
               <Reported />
               <p>The surcharge rate is reported by someone but not confirmed, It may not be accurate.</p>
             </div>
+            <div className='flex items-center gap-2'>
+              <AutoGenerated />
+              <p>The surcharge rate is assumed, It may not be accurate.</p>
+            </div>
             {
               props.includingUnknown && (
                 <div className='flex items-center gap-2'>

From cf9dd58fa5489f12837f91b1c2d2e3931eb24d71 Mon Sep 17 00:00:00 2001
From: Bonsung Koo <developer@bonsung.me>
Date: Mon, 3 Feb 2025 10:29:42 +1300
Subject: [PATCH 6/7] Privacy Policy has been changed #84 (#86)

---
 src/3_widgets/privacyPolicy/ui/PrivacyPolicy.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/3_widgets/privacyPolicy/ui/PrivacyPolicy.tsx b/src/3_widgets/privacyPolicy/ui/PrivacyPolicy.tsx
index 56f4e42..d8cbd6d 100644
--- a/src/3_widgets/privacyPolicy/ui/PrivacyPolicy.tsx
+++ b/src/3_widgets/privacyPolicy/ui/PrivacyPolicy.tsx
@@ -2,14 +2,15 @@ import { Link } from "react-router-dom";
 
 export function PrivacyPolicy() {
   return (
-    <div className="flex flex-col items-center h-screen">
+    <div className="flex flex-col items-center h-screen m-10">
       <p className="text-3xl">Surcharges Privacy Policy</p>
       <div className="text-xl mt-5">
-        <p>The Surcharges service including, iOS App, does not collect any user data of any kind.</p>
+        <p>The Surcharges service including, iOS App, does not collect any user data except purchages receipt image or photo.</p>
         <p>If you wish to verify this for yourself, see the source code through below links</p>
       </div>
       <div className="flex flex-col items-center text-xl underline mt-5">
         <Link to="https://github.com/Surcharges/Front-end">https://github.com/Surcharges/Front-end</Link>
+        <Link to="https://github.com/Surcharges/Back-end">https://github.com/Surcharges/Back-end</Link>
         <Link to="https://github.com/Surcharges/iOS">https://github.com/Surcharges/iOS</Link>
       </div>
     </div>

From 9dcc47a0f18b24e2bd1c7a4d5d4b1984bcfbdc48 Mon Sep 17 00:00:00 2001
From: Bonsung Koo <developer@bonsung.me>
Date: Mon, 3 Feb 2025 18:49:26 +1300
Subject: [PATCH 7/7] Added support page. #87 (#88)

---
 src/1_app/ui/app/App.tsx             |  4 +++-
 src/3_widgets/support/index.ts       |  1 +
 src/3_widgets/support/ui/Support.tsx | 17 +++++++++++++++++
 3 files changed, 21 insertions(+), 1 deletion(-)
 create mode 100644 src/3_widgets/support/index.ts
 create mode 100644 src/3_widgets/support/ui/Support.tsx

diff --git a/src/1_app/ui/app/App.tsx b/src/1_app/ui/app/App.tsx
index d5943bf..38b4cc8 100644
--- a/src/1_app/ui/app/App.tsx
+++ b/src/1_app/ui/app/App.tsx
@@ -10,6 +10,7 @@ import { DashBoard } from '@widgets/dashboard'
 import { Protected } from '@features/protected'
 import { AuthContextProvider } from '@shared/model'
 import { PrivacyPolicy } from '@widgets/privacyPolicy'
+import { Support } from '@widgets/support'
 
 const queryClient = new QueryClient()
 
@@ -26,12 +27,13 @@ export function App() {
                 <Route path="/place" element={<Detail />} />
                 <Route path="/report" element={<Report />} />
                 <Route path="/login" element={<Login />} />
+                <Route path="/privacy" element={<PrivacyPolicy />} />
+                <Route path="/support" element={<Support />} />
                 <Route path='/admin' element={
                   <Protected>
                     <DashBoard />
                   </Protected>
                 } />
-<Route path="/privacy" element={<PrivacyPolicy />} />
               </Routes>
             </BrowserRouter>
           </QueryClientProvider>
diff --git a/src/3_widgets/support/index.ts b/src/3_widgets/support/index.ts
new file mode 100644
index 0000000..68570f6
--- /dev/null
+++ b/src/3_widgets/support/index.ts
@@ -0,0 +1 @@
+export { Support } from "./ui/Support"
\ No newline at end of file
diff --git a/src/3_widgets/support/ui/Support.tsx b/src/3_widgets/support/ui/Support.tsx
new file mode 100644
index 0000000..ee46b09
--- /dev/null
+++ b/src/3_widgets/support/ui/Support.tsx
@@ -0,0 +1,17 @@
+import { Footer } from "@shared/ui"
+import { Link } from "react-router-dom"
+
+export function Support() {
+  return (
+    <div className="flex flex-col items-center h-screen m-10">
+      <p className="text-3xl font-bold">Surcharges</p>
+      <p className="mt-10">We are here for hearing from you.</p>
+      <div className="flex">
+        <p className="mr-1">Any kind of suggestion or inquery, click</p>
+        <Link to="mailto:surcharges@bonsung.me" className="underline">Here</Link>
+        <p className="ml-1">to mail us!</p>
+      </div>
+      <Footer />
+    </div>
+  )
+}
\ No newline at end of file