diff --git a/src/domains/LocationInfo.ts b/src/domains/LocationInfo.ts
index 04cebb6..2caee8f 100644
--- a/src/domains/LocationInfo.ts
+++ b/src/domains/LocationInfo.ts
@@ -1,5 +1,3 @@
-import { NullValueRes } from '../types/common';
-
 export type LocationInfo = {
   id: Number,
   name: string,
diff --git a/src/pages/AddLocation/index.tsx b/src/pages/AddLocation/index.tsx
index a91ebaf..907e14c 100644
--- a/src/pages/AddLocation/index.tsx
+++ b/src/pages/AddLocation/index.tsx
@@ -227,7 +227,7 @@ function AddLocation() {
               <a href={'#'} title={x.name}>
                 <img
                   loading={'lazy'}
-                  src={x.thumbnail.String.toString()}
+                  src={x.thumbnail ? x.thumbnail : ""}
                   alt={x.name}
                   style={{ aspectRatio: '1/1' }}
                 />
diff --git a/src/pages/BestLocations/index.tsx b/src/pages/BestLocations/index.tsx
index a145142..1917ced 100644
--- a/src/pages/BestLocations/index.tsx
+++ b/src/pages/BestLocations/index.tsx
@@ -9,7 +9,7 @@ interface TopLocation {
   row_number: Number,
   id: Number,
   name: String,
-  thumbnail: NullValueRes<"String", String>,
+  thumbnail: string | null,
   address: String,
   google_maps_link: string,
   regency_name: string,
@@ -145,7 +145,7 @@ function BestLocation() {
                   </div>
                   <div style={{ maxWidth: 200, maxHeight: 200, margin: '0 30px 30px 10px', float: 'left' }}>
                     <a href={`/location/${x.id}`} >
-                      <img src={x.thumbnail.String.toString()} loading={'lazy'} style={{ width: '100%', objectFit: 'cover', height: '100%', aspectRatio: '1/1' }} />
+                      <img src={x.thumbnail ? x.thumbnail : ""} loading={'lazy'} style={{ width: '100%', objectFit: 'cover', height: '100%', aspectRatio: '1/1' }} />
                     </a>
                   </div>
                   <div className={'text-md font-bold'}>{x.regency_name}</div>
diff --git a/src/pages/Home/index.tsx b/src/pages/Home/index.tsx
index 3b3fc56..6b9ed4b 100644
--- a/src/pages/Home/index.tsx
+++ b/src/pages/Home/index.tsx
@@ -53,16 +53,8 @@ function Home() {
     }
   }
 
-  function onNavigateToDetail(
-    id: Number,
-    critic_count: Number,
-    critic_score: Number,
-    user_count: Number,
-    user_score: Number,
-  ) {
-
-    navigate(`/location/${id}`, { state: { user_score: user_score, user_count: user_count, critic_score: critic_score, critic_count: critic_count } })
-
+  function onNavigateToDetail(id: Number,) {
+    navigate(`/location/${id}`)
   }
 
   useEffect(() => {
@@ -79,7 +71,7 @@ function Home() {
           <SeparatorWithAnchor pageLink='#' pageName='recently added' secondLink='#' />
           {recentLocations.map((x) => (
             <div className={"recently-added-section-card"}>
-              <a onClick={() => onNavigateToDetail(x.id, x.critic_count, x.critic_score, x.user_count, x.user_score)}>
+              <a onClick={() => onNavigateToDetail(x.id)}>
                 <div className={'border-secondary recently-img-container'}>
                   <img alt={x.name} src={x.thumbnail ? x.thumbnail : ''} loading="lazy" style={{ width: '100%', height: '100%' }} />
                 </div>
diff --git a/src/pages/LocationDetail/index.tsx b/src/pages/LocationDetail/index.tsx
index 4cad30b..1f27ade 100644
--- a/src/pages/LocationDetail/index.tsx
+++ b/src/pages/LocationDetail/index.tsx
@@ -61,7 +61,9 @@ function LocationDetail() {
     try {
       const res = await getLocationService(Number(id))
       setLocationDetail(res.data, (val) => {
-        getImage(val.detail.thumbnail.String.toString())
+        if(val.detail.thumbnail) {
+          getImage(val.detail.thumbnail)
+        }
       })
     } catch (error) {
       let err = error as AxiosError;
@@ -223,7 +225,7 @@ function LocationDetail() {
                   style={{ display: 'grid', position: 'relative', gridTemplateColumns: 'repeat(12,1fr)', cursor: 'zoom-in' }}
                 >{Number(locationImages?.total_image) > 0 &&
                   <div class="image-stack__item image-stack__item--top">
-                    <img src={locationDetail.detail.thumbnail.String.toString()} alt="" style={{ aspectRatio: '1/1' }} />
+                    <img src={locationDetail.detail.thumbnail ? locationDetail.detail.thumbnail : ""} alt="" style={{ aspectRatio: '1/1' }} />
                     {locationImages?.images.length > 1 &&
                       <div className={'text-xs p-2 bg-primary'} style={{ position: 'absolute', bottom: 0, right: 0 }}>
                         Total images ({locationImages?.images.length})
@@ -237,7 +239,7 @@ function LocationDetail() {
                     </div>
                   }
                   <div class="image-stack__item image-stack__item--bottom" style={Number(locationImages?.total_image) > 1 ? {} : { gridColumn: '13/1' }}>
-                    <img src={Number(locationImages?.total_image) > 1 ? locationImages?.images[1].src.toString() : locationDetail.detail.thumbnail.String.toString()} alt="" style={{ aspectRatio: '1/1' }} />
+                    <img src={Number(locationImages?.total_image) > 1 ? locationImages?.images[1].src.toString() : locationDetail.detail.thumbnail!} alt="" style={{ aspectRatio: '1/1' }} />
                   </div>
                 </a>
               </div>
@@ -433,7 +435,7 @@ function LocationDetail() {
                             <img
                               loading={'lazy'}
                               style={{ width: '100%' }}
-                              src={x.user_avatar.Valid ? x.user_avatar.String.toString() : 'https://cdn.discordapp.com/attachments/743422487882104837/1153985664849805392/421-4212617_person-placeholder-image-transparent-hd-png-download.png'}
+                              src={x.user_avatar ? x.user_avatar : 'https://cdn.discordapp.com/attachments/743422487882104837/1153985664849805392/421-4212617_person-placeholder-image-transparent-hd-png-download.png'}
                             />
                           </a>
                         </div>
@@ -486,7 +488,7 @@ function LocationDetail() {
                             <img
                               loading={'lazy'}
                               style={{ width: '100%' }}
-                              src={x.user_avatar.Valid ? x.user_avatar.String.toString() : 'https://cdn.discordapp.com/attachments/743422487882104837/1153985664849805392/421-4212617_person-placeholder-image-transparent-hd-png-download.png'}
+                              src={x.user_avatar ? x.user_avatar : 'https://cdn.discordapp.com/attachments/743422487882104837/1153985664849805392/421-4212617_person-placeholder-image-transparent-hd-png-download.png'}
                             />
                           </a>
                         </div>
diff --git a/src/pages/LocationDetail/types.ts b/src/pages/LocationDetail/types.ts
index 3412040..b65e628 100644
--- a/src/pages/LocationDetail/types.ts
+++ b/src/pages/LocationDetail/types.ts
@@ -9,7 +9,7 @@ export interface ILocationDetail {
   province_name: String,
   region_name: String,  
   google_maps_link: String,
-  thumbnail: NullValueRes<"String", String>,
+  thumbnail: string | null,
   submitted_by: Number,
   critic_score: Number,
   critic_count: Number,
@@ -22,7 +22,7 @@ export function emptyLocationDetail(): ILocationDetail {
     id: 0,
     address: '',
     google_maps_link: '',
-    thumbnail: { String: '', Valid: false },
+    thumbnail: "",
     name: '',
     province_name: '',
     regency_name: '',
@@ -41,7 +41,7 @@ export interface LocationReviewsResponse {
   comments: string,
   user_id: number,
   username: string,
-  user_avatar: NullValueRes<"String", string>,
+  user_avatar: string | null,
   created_at: string,
   updated_at: string
 }