diff --git a/.npmrc b/.npmrc
new file mode 100644
index 0000000..f87a044
--- /dev/null
+++ b/.npmrc
@@ -0,0 +1 @@
+auto-install-peers=true
\ No newline at end of file
diff --git a/package.json b/package.json
index b0172ec..4e863f5 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@buildo/bento-design-system": "^0.20.4",
+    "@buildo/formo": "^2.0.2",
     "@tanstack/react-query": "^4.36.1",
     "i18next": "^23.5.1",
     "react": "^18.2.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index bc7a54f..9ef3e98 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -8,6 +8,9 @@ dependencies:
   '@buildo/bento-design-system':
     specifier: ^0.20.4
     version: 0.20.4(@types/react@18.2.25)(prop-types@15.8.1)(react-dom@18.2.0)(react@18.2.0)
+  '@buildo/formo':
+    specifier: ^2.0.2
+    version: 2.0.2(react@18.2.0)
   '@tanstack/react-query':
     specifier: ^4.36.1
     version: 4.36.1(react-dom@18.2.0)(react@18.2.0)
@@ -373,6 +376,14 @@ packages:
       - prop-types
     dev: false
 
+  /@buildo/formo@2.0.2(react@18.2.0):
+    resolution: {integrity: sha512-BcmPPcmC66cJBHmQNlqwkO6qM+5PqxKQYhGbXjdX4GISRwKSn3k+ciZslqZZjLS+s2+vyMcFZq63IpTdxcO1/Q==}
+    peerDependencies:
+      react: ^17.0.1
+    dependencies:
+      react: 18.2.0
+    dev: false
+
   /@datepicker-react/hooks@2.8.4(react@18.2.0):
     resolution: {integrity: sha512-qaYJKK5sOSdqcL/OnCtyv3/Q6fRRljfeAyl5ISTPgEO0CM5xZzkGmTx40+6wvqjH5lEZH4ysS95nPyLwZS2tlw==}
     peerDependencies:
diff --git a/src/App.tsx b/src/App.tsx
index 01f55f3..b1a49b2 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -6,6 +6,7 @@ import { BentoProvider, Headline, Inset } from "@buildo/bento-design-system";
 import { BrowserRouter, Routes, Route } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import Home from "./pages/Home";
+import RestaurantDetail from "./pages/RestaurantDetail";
 
 function App() {
   const { t } = useTranslation();
@@ -19,8 +20,8 @@ function App() {
           </Headline>
         </Inset>
         <Routes>
-          <Route path="/" element={<Home />} />
-          {/* <Route path="/" element={<Restaurant />} /> */}
+          <Route path="/home" element={<Home />} />
+          <Route path="/restaurat-detail/:id" element={<RestaurantDetail />} />
         </Routes>
       </BrowserRouter>
     </BentoProvider>
diff --git a/src/api.tsx b/src/api.tsx
index 339c6b4..d2d0365 100644
--- a/src/api.tsx
+++ b/src/api.tsx
@@ -2,8 +2,39 @@ import { apiSecret } from "./models";
 
 const apiKey = import.meta.env.VITE_API_KEY;
 
-export const getRestaurantList = async (range: number) => {
-  const uri = `/api/search?sort_by=best_match&limit=${range}&location=Milano`;
+export const getRestaurantList = async ({
+  prices,
+  location,
+  radius,
+}: {
+  prices: string[];
+  location: string;
+  radius: number;
+}) => {
+  const priceParamsString: string = prices.join("&");
+  const radiusParamsString: string =
+    radius == 0 ? "900" : radius.toString() + "000";
+  const uri = `/api/search?sort_by=best_match&location=${location}&radius=${radiusParamsString}&${priceParamsString}`;
+  const apik = apiSecret.safeParse(apiKey);
+
+  if (apik.success) {
+    return (
+      await fetch(uri, {
+        method: "get",
+        headers: {
+          Accept: "application/json",
+          "Content-Type": "application/json",
+          Authorization: "Bearer " + apiKey,
+        },
+      })
+    ).json();
+  } else {
+    throw apik.error;
+  }
+};
+
+export const getRestaurantDetails = async (id: string) => {
+  const uri = `/api/${id}`;
   const apik = apiSecret.safeParse(apiKey);
 
   if (apik.success) {
diff --git a/src/components/RestaurantPreview.tsx b/src/components/RestaurantPreview.tsx
index 7c35ae1..057c616 100644
--- a/src/components/RestaurantPreview.tsx
+++ b/src/components/RestaurantPreview.tsx
@@ -4,33 +4,44 @@ import {
   Title,
   Body,
   Label,
-  Box,
+  Button,
 } from "@buildo/bento-design-system";
 import { useTranslation } from "react-i18next";
-import { PreviewProp } from "../models";
+import { useNavigate } from "react-router-dom";
+import { PreviewPropComponent } from "../models";
 
-function RestaurantPreview(props: PreviewProp) {
+function RestaurantPreview(props: PreviewPropComponent) {
   const { t } = useTranslation();
-  const rating = props.rating;
+  const rating = props.vars.rating;
   const imagePrev =
-    props.imageUrl === ""
+    props.vars.imageUrl === ""
       ? "https://upload.wikimedia.org/wikipedia/commons/thumb/6/62/Barbieri_-_ViaSophia25668.jpg/1200px-Barbieri_-_ViaSophia25668.jpg"
-      : props.imageUrl;
+      : props.vars.imageUrl;
 
+  const navigate = useNavigate();
   return (
-    <Card elevation="small" borderRadius={8} paddingX={24} paddingY={40}>
-      <Stack space={8}>
-        <Box height="full" justifyContent="center" alignItems="center">
-          <img src={imagePrev} width="70%" height="100px" />
-        </Box>
+    <Card elevation="small" borderRadius={8} padding={16} paddingTop={24}>
+      <Stack space={8} align="center">
+        <img
+          src={imagePrev}
+          style={{ height: "200px", width: "100%", objectFit: "scale-down" }}
+        />
+        <Title size="medium">{props.vars.name}</Title>
+        <Body size="medium">
+          {props.vars.address}
 
-        <Title size="small">{props.name}</Title>
-        <Body size="small">
-          {props.address}
           <Label size="small" color="default">
             {t("Card.Rating", { rating })}
           </Label>
         </Body>
+        <Button
+          onPress={() => {
+            return navigate(`/restaurat-detail/${props.vars.id}`);
+          }}
+          kind="transparent"
+          label={t("Card.ButtonLabel")}
+          hierarchy="primary"
+        ></Button>
       </Stack>
     </Card>
   );
diff --git a/src/hooks.tsx b/src/hooks.tsx
index b2f9a13..7def5fb 100644
--- a/src/hooks.tsx
+++ b/src/hooks.tsx
@@ -1,15 +1,34 @@
 import { useQuery } from "@tanstack/react-query";
-import { getRestaurantList } from "./api";
-import { fromJsonToProp } from "./utils";
+import { getRestaurantList, getRestaurantDetails } from "./api";
+import { fromJsonToPropPreview, fromJsonToPropDetails } from "./utils";
+import { PreviewList, DetailsPropApi } from "./models";
 
-function useGetRestaurantList(range: number) {
-  return useQuery({
-    queryKey: ["retrieve-list", range],
-    queryFn: async () => {
-      const prom: JSON = await getRestaurantList(range);
-      return fromJsonToProp(prom);
+export function useGetRestaurantList(filtersParams: {
+  prices: string[];
+  location: string;
+  radius: number;
+}) {
+  return useQuery(
+    [
+      "restaurantList",
+      filtersParams.location.toString,
+      filtersParams.radius.toString,
+      filtersParams.prices.toString,
+    ],
+    async (): Promise<PreviewList> => {
+      const prom: JSON = await getRestaurantList(filtersParams);
+      return fromJsonToPropPreview(prom);
     },
-  });
+    { enabled: false }
+  );
 }
 
-export default useGetRestaurantList;
+export function useGetRestaurantDetails(id: string) {
+  return useQuery(
+    ["restaurantDetails", id],
+    async (): Promise<DetailsPropApi> => {
+      const prom: JSON = await getRestaurantDetails(id);
+      return fromJsonToPropDetails(prom);
+    }
+  );
+}
diff --git a/src/locales/en.json b/src/locales/en.json
index 2270ae8..9be29b7 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -1,6 +1,17 @@
 {
     "title": "YelpLike",
     "Card": {
-      "Rating": "Rating: {{rating}} ★"
-    }
+      "Rating": "Rating: {{rating}} ⭐",
+      "ButtonLabel":"See details"
+    },
+    "priceRangefilter":"Average price : ",
+    "Location":{
+      "Placeholder":"Type here your location ... ",
+      "Label": "Location :"
+    },
+    "RangeDistance":{
+      "Label":"Distance :"
+    },
+    "SearchButton": "Search"
+
   }
\ No newline at end of file
diff --git a/src/mock-data/rest_detail.json b/src/mock-data/rest_detail.json
deleted file mode 100644
index 36be6d7..0000000
--- a/src/mock-data/rest_detail.json
+++ /dev/null
@@ -1,126 +0,0 @@
-{
-    "id": "h6Ke3gesnvqnPokG3PE8lA",
-    "alias": "la-chiocciola-san-martino-di-trecate",
-    "name": "La Chiocciola",
-    "image_url": "https://s3-media2.fl.yelpcdn.com/bphoto/9IsZmjdy7cu60HOyui942Q/o.jpg",
-    "is_claimed": false,
-    "is_closed": false,
-    "url": "https://www.yelp.com/biz/la-chiocciola-san-martino-di-trecate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_lookup&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-    "phone": "+393288597596",
-    "display_phone": "+39 328 859 7596",
-    "review_count": 1,
-    "categories": [
-        {
-            "alias": "lumbard",
-            "title": "Lumbard"
-        },
-        {
-            "alias": "trattorie",
-            "title": "Trattorie"
-        },
-        {
-            "alias": "piemonte",
-            "title": "Piemonte"
-        }
-    ],
-    "rating": 5.0,
-    "location": {
-        "address1": "Località Bosco Marino",
-        "address2": "",
-        "address3": null,
-        "city": "San Martino di Trecate",
-        "zip_code": "28069",
-        "country": "IT",
-        "state": "NO",
-        "display_address": [
-            "Località Bosco Marino",
-            "28069 San Martino di Trecate",
-            "Italy"
-        ],
-        "cross_streets": ""
-    },
-    "coordinates": {
-        "latitude": 45.43828,
-        "longitude": 8.80424
-    },
-    "photos": [
-        "https://s3-media2.fl.yelpcdn.com/bphoto/9IsZmjdy7cu60HOyui942Q/o.jpg",
-        "https://s3-media4.fl.yelpcdn.com/bphoto/DuaBzKjJ5CbfFloI5cy65g/o.jpg",
-        "https://s3-media1.fl.yelpcdn.com/bphoto/-5thX3GqcoQOVcW0L5_JKQ/o.jpg"
-    ],
-    "hours": [
-        {
-            "open": [
-                {
-                    "is_overnight": false,
-                    "start": "1000",
-                    "end": "1500",
-                    "day": 0
-                },
-                {
-                    "is_overnight": false,
-                    "start": "1000",
-                    "end": "1500",
-                    "day": 2
-                },
-                {
-                    "is_overnight": false,
-                    "start": "1900",
-                    "end": "2200",
-                    "day": 2
-                },
-                {
-                    "is_overnight": false,
-                    "start": "1000",
-                    "end": "1500",
-                    "day": 3
-                },
-                {
-                    "is_overnight": false,
-                    "start": "1900",
-                    "end": "2200",
-                    "day": 3
-                },
-                {
-                    "is_overnight": false,
-                    "start": "1000",
-                    "end": "1500",
-                    "day": 4
-                },
-                {
-                    "is_overnight": false,
-                    "start": "1900",
-                    "end": "2200",
-                    "day": 4
-                },
-                {
-                    "is_overnight": false,
-                    "start": "1000",
-                    "end": "1500",
-                    "day": 5
-                },
-                {
-                    "is_overnight": false,
-                    "start": "1900",
-                    "end": "2200",
-                    "day": 5
-                },
-                {
-                    "is_overnight": false,
-                    "start": "1000",
-                    "end": "1500",
-                    "day": 6
-                },
-                {
-                    "is_overnight": false,
-                    "start": "1900",
-                    "end": "2200",
-                    "day": 6
-                }
-            ],
-            "hours_type": "REGULAR",
-            "is_open_now": false
-        }
-    ],
-    "transactions": []
-}
\ No newline at end of file
diff --git a/src/mock-data/rest_list.json b/src/mock-data/rest_list.json
deleted file mode 100644
index 1c93406..0000000
--- a/src/mock-data/rest_list.json
+++ /dev/null
@@ -1,864 +0,0 @@
-{
-    "businesses": [
-        {
-            "id": "h6Ke3gesnvqnPokG3PE8lA",
-            "alias": "la-chiocciola-san-martino-di-trecate",
-            "name": "La Chiocciola",
-            "image_url": "https://s3-media2.fl.yelpcdn.com/bphoto/9IsZmjdy7cu60HOyui942Q/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/la-chiocciola-san-martino-di-trecate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 1,
-            "categories": [
-                {
-                    "alias": "lumbard",
-                    "title": "Lumbard"
-                },
-                {
-                    "alias": "trattorie",
-                    "title": "Trattorie"
-                },
-                {
-                    "alias": "piemonte",
-                    "title": "Piemonte"
-                }
-            ],
-            "rating": 5.0,
-            "coordinates": {
-                "latitude": 45.43828,
-                "longitude": 8.80424
-            },
-            "transactions": [],
-            "location": {
-                "address1": "Località Bosco Marino",
-                "address2": "",
-                "address3": null,
-                "city": "San Martino di Trecate",
-                "zip_code": "28069",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Località Bosco Marino",
-                    "28069 San Martino di Trecate",
-                    "Italy"
-                ]
-            },
-            "phone": "+393288597596",
-            "display_phone": "+39 328 859 7596",
-            "distance": 2714.556604355828
-        },
-        {
-            "id": "Yx1l4Paq9mwF0S-7vnaNyg",
-            "alias": "la-locanda-delle-due-suocere-novara",
-            "name": "La locanda delle Due Suocere",
-            "image_url": "https://s3-media3.fl.yelpcdn.com/bphoto/F0SKERAQ6v7oKQJYL4DNCg/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/la-locanda-delle-due-suocere-novara?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 6,
-            "categories": [
-                {
-                    "alias": "italian",
-                    "title": "Italian"
-                }
-            ],
-            "rating": 5.0,
-            "coordinates": {
-                "latitude": 45.449084073781,
-                "longitude": 8.63833954995579
-            },
-            "transactions": [],
-            "price": "€€€",
-            "location": {
-                "address1": "Corso Trieste 44A",
-                "address2": "",
-                "address3": "",
-                "city": "Novara",
-                "zip_code": "28100",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Corso Trieste 44A",
-                    "28100 Novara",
-                    "Italy"
-                ]
-            },
-            "phone": "+390321032310",
-            "display_phone": "+39 0321 032310",
-            "distance": 9781.902638334106
-        },
-        {
-            "id": "Uv7361sBHfKi7Y_mi-pIMw",
-            "alias": "the-kitchen-galliate",
-            "name": "The Kitchen",
-            "image_url": "https://s3-media3.fl.yelpcdn.com/bphoto/92_h-G5ArBBa1TEdAxchuA/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/the-kitchen-galliate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 2,
-            "categories": [
-                {
-                    "alias": "italian",
-                    "title": "Italian"
-                },
-                {
-                    "alias": "pubs",
-                    "title": "Pubs"
-                },
-                {
-                    "alias": "burgers",
-                    "title": "Burgers"
-                }
-            ],
-            "rating": 5.0,
-            "coordinates": {
-                "latitude": 45.4703791154553,
-                "longitude": 8.69060564786196
-            },
-            "transactions": [],
-            "price": "€€",
-            "location": {
-                "address1": "Via Monte Nero 73",
-                "address2": "",
-                "address3": "",
-                "city": "Galliate",
-                "zip_code": "28066",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Via Monte Nero 73",
-                    "28066 Galliate",
-                    "Italy"
-                ]
-            },
-            "phone": "+390321865491",
-            "display_phone": "+39 0321 865491",
-            "distance": 5685.20440166748
-        },
-        {
-            "id": "RdUPWuyu2ZfIKDHv_i7etA",
-            "alias": "caruso-trecate",
-            "name": "Caruso",
-            "image_url": "https://s3-media2.fl.yelpcdn.com/bphoto/6hdAFS0aa3diDUHX9Xq4DA/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/caruso-trecate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 1,
-            "categories": [
-                {
-                    "alias": "gluten_free",
-                    "title": "Gluten-Free"
-                },
-                {
-                    "alias": "pizza",
-                    "title": "Pizza"
-                }
-            ],
-            "rating": 5.0,
-            "coordinates": {
-                "latitude": 45.4320488,
-                "longitude": 8.7364502
-            },
-            "transactions": [],
-            "location": {
-                "address1": "Via Adua",
-                "address2": "",
-                "address3": "",
-                "city": "Trecate",
-                "zip_code": "28069",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Via Adua",
-                    "28069 Trecate",
-                    "Italy"
-                ]
-            },
-            "phone": "+39032171584",
-            "display_phone": "+39 0321 71584",
-            "distance": 3849.4625481397206
-        },
-        {
-            "id": "6g4OpC25xYxk6ax5wWZSPg",
-            "alias": "la-vecchia-trecate",
-            "name": "La Vecchia",
-            "image_url": "",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/la-vecchia-trecate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 2,
-            "categories": [
-                {
-                    "alias": "pizza",
-                    "title": "Pizza"
-                }
-            ],
-            "rating": 5.0,
-            "coordinates": {
-                "latitude": 45.4303203974162,
-                "longitude": 8.73915885771504
-            },
-            "transactions": [],
-            "price": "€€",
-            "location": {
-                "address1": "Piazza Cattaneo 27",
-                "address2": "",
-                "address3": "",
-                "city": "Trecate",
-                "zip_code": "28069",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Piazza Cattaneo 27",
-                    "28069 Trecate",
-                    "Italy"
-                ]
-            },
-            "phone": "+39032176591",
-            "display_phone": "+39 0321 76591",
-            "distance": 3934.9649409483986
-        },
-        {
-            "id": "gT0MOQHMdYcZsN6UrLBJDQ",
-            "alias": "don-bi-caffè-trecate",
-            "name": "Don Bi Caffè",
-            "image_url": "https://s3-media1.fl.yelpcdn.com/bphoto/9aVP7Xa3wyEClwPDvGZrRA/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/don-bi-caff%C3%A8-trecate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 1,
-            "categories": [
-                {
-                    "alias": "breakfast_brunch",
-                    "title": "Breakfast & Brunch"
-                },
-                {
-                    "alias": "cafes",
-                    "title": "Cafes"
-                }
-            ],
-            "rating": 5.0,
-            "coordinates": {
-                "latitude": 45.43177,
-                "longitude": 8.73
-            },
-            "transactions": [],
-            "location": {
-                "address1": "Via Novara 11",
-                "address2": "",
-                "address3": null,
-                "city": "Trecate",
-                "zip_code": "28069",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Via Novara 11",
-                    "28069 Trecate",
-                    "Italy"
-                ]
-            },
-            "phone": "+393470921722",
-            "display_phone": "+39 347 092 1722",
-            "distance": 4196.167943013563
-        },
-        {
-            "id": "oRwBlM47rBajvOONI86MyA",
-            "alias": "cannavacciuolo-novara",
-            "name": "Cannavacciuolo",
-            "image_url": "https://s3-media4.fl.yelpcdn.com/bphoto/TtEh4KBcwdMcWtDb77LQOA/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/cannavacciuolo-novara?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 4,
-            "categories": [
-                {
-                    "alias": "bistros",
-                    "title": "Bistros"
-                },
-                {
-                    "alias": "italian",
-                    "title": "Italian"
-                }
-            ],
-            "rating": 4.5,
-            "coordinates": {
-                "latitude": 45.4458204741876,
-                "longitude": 8.61788425594568
-            },
-            "transactions": [],
-            "location": {
-                "address1": "Piazza Martiri della Libertà 1",
-                "address2": "",
-                "address3": null,
-                "city": "Novara",
-                "zip_code": "28100",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Piazza Martiri della Libertà 1",
-                    "28100 Novara",
-                    "Italy"
-                ]
-            },
-            "phone": "+390321612109",
-            "display_phone": "+39 0321 612109",
-            "distance": 11414.027427426281
-        },
-        {
-            "id": "arMDeTjd0dGh0kf7UJCrQw",
-            "alias": "re-matto-galliate",
-            "name": "Re Matto",
-            "image_url": "https://s3-media3.fl.yelpcdn.com/bphoto/IfKt4VPWp-U0ndAUkvB0EQ/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/re-matto-galliate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 2,
-            "categories": [
-                {
-                    "alias": "cafes",
-                    "title": "Cafes"
-                },
-                {
-                    "alias": "breakfast_brunch",
-                    "title": "Breakfast & Brunch"
-                },
-                {
-                    "alias": "cocktailbars",
-                    "title": "Cocktail Bars"
-                }
-            ],
-            "rating": 4.5,
-            "coordinates": {
-                "latitude": 45.4778700665021,
-                "longitude": 8.69518015533686
-            },
-            "transactions": [],
-            "price": "€€",
-            "location": {
-                "address1": "Piazza Martiri della Libertà 18",
-                "address2": "",
-                "address3": "",
-                "city": "Galliate",
-                "zip_code": "28066",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Piazza Martiri della Libertà 18",
-                    "28066 Galliate",
-                    "Italy"
-                ]
-            },
-            "phone": "+3903211581234",
-            "display_phone": "+39 0321 158 1234",
-            "distance": 5545.037510995885
-        },
-        {
-            "id": "ml6lAMK2W65edg9BCZSSXg",
-            "alias": "gallo-d-oro-galliate",
-            "name": "Gallo D'oro",
-            "image_url": "https://s3-media3.fl.yelpcdn.com/bphoto/y7FPz90-y9cZewxMFZMW3Q/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/gallo-d-oro-galliate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 1,
-            "categories": [
-                {
-                    "alias": "breweries",
-                    "title": "Breweries"
-                },
-                {
-                    "alias": "pubs",
-                    "title": "Pubs"
-                }
-            ],
-            "rating": 4.0,
-            "coordinates": {
-                "latitude": 45.4762399254668,
-                "longitude": 8.69580008089542
-            },
-            "transactions": [],
-            "price": "€€",
-            "location": {
-                "address1": "Via Antonio Gramsci 25",
-                "address2": "",
-                "address3": null,
-                "city": "Galliate",
-                "zip_code": "28066",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Via Antonio Gramsci 25",
-                    "28066 Galliate",
-                    "Italy"
-                ]
-            },
-            "phone": "+390321865463",
-            "display_phone": "+39 0321 865463",
-            "distance": 5442.864969500726
-        },
-        {
-            "id": "xTgqS2HDNsTfqpDLDnCjpA",
-            "alias": "celtic-house-magenta",
-            "name": "Celtic House",
-            "image_url": "",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/celtic-house-magenta?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 2,
-            "categories": [
-                {
-                    "alias": "burgers",
-                    "title": "Burgers"
-                },
-                {
-                    "alias": "irish",
-                    "title": "Irish"
-                },
-                {
-                    "alias": "irish_pubs",
-                    "title": "Irish Pub"
-                }
-            ],
-            "rating": 4.5,
-            "coordinates": {
-                "latitude": 45.45943,
-                "longitude": 8.86839
-            },
-            "transactions": [],
-            "location": {
-                "address1": "Via Fratelli di Dio 2",
-                "address2": "",
-                "address3": null,
-                "city": "Magenta",
-                "zip_code": "20013",
-                "country": "IT",
-                "state": "MI",
-                "display_address": [
-                    "Via Fratelli di Dio 2",
-                    "20013 Magenta",
-                    "Italy"
-                ]
-            },
-            "phone": "+39029785233",
-            "display_phone": "+39 02 978 5233",
-            "distance": 8241.871171323959
-        },
-        {
-            "id": "uwpfuhWkrqMkEvSv2AdhKw",
-            "alias": "la-playa-novara-2",
-            "name": "La Playa",
-            "image_url": "",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/la-playa-novara-2?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 1,
-            "categories": [
-                {
-                    "alias": "bars",
-                    "title": "Bars"
-                },
-                {
-                    "alias": "mediterranean",
-                    "title": "Mediterranean"
-                },
-                {
-                    "alias": "pizza",
-                    "title": "Pizza"
-                }
-            ],
-            "rating": 4.0,
-            "coordinates": {
-                "latitude": 45.5025599705713,
-                "longitude": 8.72361592948437
-            },
-            "transactions": [],
-            "price": "€€",
-            "location": {
-                "address1": "Località Ponte Ticino",
-                "address2": "Via del Mezzanino",
-                "address3": "",
-                "city": "Novara",
-                "zip_code": "28066",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Località Ponte Ticino",
-                    "Via del Mezzanino",
-                    "28066 Novara",
-                    "Italy"
-                ]
-            },
-            "phone": "+390321861054",
-            "display_phone": "+39 0321 861054",
-            "distance": 5458.97240054184
-        },
-        {
-            "id": "90KpkHxfMYW3BPwb0FDoIw",
-            "alias": "santa-maria-trecate",
-            "name": "Santa Maria",
-            "image_url": "https://s3-media4.fl.yelpcdn.com/bphoto/pH9R1zDFsm6WeMFffkxtRw/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/santa-maria-trecate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 1,
-            "categories": [
-                {
-                    "alias": "trattorie",
-                    "title": "Trattorie"
-                }
-            ],
-            "rating": 5.0,
-            "coordinates": {
-                "latitude": 45.4316253662109,
-                "longitude": 8.72895431518555
-            },
-            "transactions": [],
-            "location": {
-                "address1": "Via Novara 39",
-                "address2": "",
-                "address3": "",
-                "city": "Trecate",
-                "zip_code": "28069",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Via Novara 39",
-                    "28069 Trecate",
-                    "Italy"
-                ]
-            },
-            "phone": "+39032176163",
-            "display_phone": "+39 0321 76163",
-            "distance": 4267.398966307744
-        },
-        {
-            "id": "Z6SNg8OJ-0Zlb-MwMcI7XA",
-            "alias": "beerbacco-galliate",
-            "name": "BeerBacco",
-            "image_url": "https://s3-media3.fl.yelpcdn.com/bphoto/ignDTYBJGUcj1XGcp2ufXQ/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/beerbacco-galliate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 1,
-            "categories": [
-                {
-                    "alias": "pubs",
-                    "title": "Pubs"
-                }
-            ],
-            "rating": 4.0,
-            "coordinates": {
-                "latitude": 45.4771398707097,
-                "longitude": 8.69548592716455
-            },
-            "transactions": [],
-            "price": "€€",
-            "location": {
-                "address1": "Via Antonio Gramsci 1",
-                "address2": "",
-                "address3": null,
-                "city": "Galliate",
-                "zip_code": "28066",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Via Antonio Gramsci 1",
-                    "28066 Galliate",
-                    "Italy"
-                ]
-            },
-            "phone": "+393409848097",
-            "display_phone": "+39 340 984 8097",
-            "distance": 5496.6339343255395
-        },
-        {
-            "id": "kqHdm4nh086qeHwzM5QPEA",
-            "alias": "american-graffiti-trecate",
-            "name": "American Graffiti",
-            "image_url": "https://s3-media3.fl.yelpcdn.com/bphoto/TjboKqCZrQyW5b5JOquN0g/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/american-graffiti-trecate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 4,
-            "categories": [
-                {
-                    "alias": "bbq",
-                    "title": "Barbeque"
-                },
-                {
-                    "alias": "burgers",
-                    "title": "Burgers"
-                },
-                {
-                    "alias": "tradamerican",
-                    "title": "American (Traditional)"
-                }
-            ],
-            "rating": 3.0,
-            "coordinates": {
-                "latitude": 45.4394627123701,
-                "longitude": 8.74873749911785
-            },
-            "transactions": [],
-            "location": {
-                "address1": "Via dei Delfini 24",
-                "address2": "",
-                "address3": "",
-                "city": "Trecate",
-                "zip_code": "28069",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Via dei Delfini 24",
-                    "28069 Trecate",
-                    "Italy"
-                ]
-            },
-            "phone": "+3903211820106",
-            "display_phone": "+39 0321 182 0106",
-            "distance": 2695.1095386057004
-        },
-        {
-            "id": "QsSXh4Ja1uL8bW7yb73-Yg",
-            "alias": "wallaby-australian-pub-magenta",
-            "name": "Wallaby Australian Pub",
-            "image_url": "https://s3-media2.fl.yelpcdn.com/bphoto/It3a2fTSB1uB2Mlt5x3t2Q/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/wallaby-australian-pub-magenta?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 2,
-            "categories": [
-                {
-                    "alias": "burgers",
-                    "title": "Burgers"
-                },
-                {
-                    "alias": "pubs",
-                    "title": "Pubs"
-                },
-                {
-                    "alias": "sandwiches",
-                    "title": "Sandwiches"
-                }
-            ],
-            "rating": 4.5,
-            "coordinates": {
-                "latitude": 45.4690399169922,
-                "longitude": 8.89042758941651
-            },
-            "transactions": [],
-            "price": "€€",
-            "location": {
-                "address1": "Via Gioacchino Rossini 7",
-                "address2": "",
-                "address3": "",
-                "city": "Magenta",
-                "zip_code": "20013",
-                "country": "IT",
-                "state": "MI",
-                "display_address": [
-                    "Via Gioacchino Rossini 7",
-                    "20013 Magenta",
-                    "Italy"
-                ]
-            },
-            "phone": "+39029790372",
-            "display_phone": "+39 02 979 0372",
-            "distance": 10091.689799124775
-        },
-        {
-            "id": "9vXG1iw-w3wJuUew1l5eew",
-            "alias": "km-zero-galliate",
-            "name": "Km Zero",
-            "image_url": "https://s3-media3.fl.yelpcdn.com/bphoto/4VcoDLsgY7CsFUwAvGrEzw/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/km-zero-galliate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 1,
-            "categories": [
-                {
-                    "alias": "bars",
-                    "title": "Bars"
-                }
-            ],
-            "rating": 4.0,
-            "coordinates": {
-                "latitude": 45.4756500632769,
-                "longitude": 8.69368012994528
-            },
-            "transactions": [],
-            "price": "€",
-            "location": {
-                "address1": "Viale D Alighieri 49",
-                "address2": "",
-                "address3": "",
-                "city": "Galliate",
-                "zip_code": "28066",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "Viale D Alighieri 49",
-                    "28066 Galliate",
-                    "Italy"
-                ]
-            },
-            "phone": "+393933389358",
-            "display_phone": "+39 393 338 9358",
-            "distance": 5582.40185100216
-        },
-        {
-            "id": "4pcHqOO0v_roG91yFwpd3g",
-            "alias": "penny-black-galliate",
-            "name": "Penny black",
-            "image_url": "",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/penny-black-galliate?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 1,
-            "categories": [
-                {
-                    "alias": "irish_pubs",
-                    "title": "Irish Pub"
-                }
-            ],
-            "rating": 4.0,
-            "coordinates": {
-                "latitude": 45.4776917,
-                "longitude": 8.7131796
-            },
-            "transactions": [],
-            "price": "€€",
-            "location": {
-                "address1": "via varallino 111",
-                "address2": "",
-                "address3": "",
-                "city": "Galliate",
-                "zip_code": "28066",
-                "country": "IT",
-                "state": "NO",
-                "display_address": [
-                    "via varallino 111",
-                    "28066 Galliate",
-                    "Italy"
-                ]
-            },
-            "phone": "",
-            "display_phone": "",
-            "distance": 4233.9038442103565
-        },
-        {
-            "id": "e-n6ZHiEWwd5LjVeeCOa3g",
-            "alias": "il-palio-magenta",
-            "name": "Il Palio",
-            "image_url": "",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/il-palio-magenta?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 1,
-            "categories": [
-                {
-                    "alias": "tuscan",
-                    "title": "Tuscan"
-                },
-                {
-                    "alias": "pizza",
-                    "title": "Pizza"
-                }
-            ],
-            "rating": 4.0,
-            "coordinates": {
-                "latitude": 45.47478,
-                "longitude": 8.88412
-            },
-            "transactions": [],
-            "price": "€€€",
-            "location": {
-                "address1": "Via Gabriele d'Annunzio 35",
-                "address2": null,
-                "address3": null,
-                "city": "Magenta",
-                "zip_code": "20013",
-                "country": "IT",
-                "state": "MI",
-                "display_address": [
-                    "Via Gabriele d'Annunzio 35",
-                    "20013 Magenta",
-                    "Italy"
-                ]
-            },
-            "phone": "+390297299984",
-            "display_phone": "+39 02 9729 9984",
-            "distance": 9597.745247306148
-        },
-        {
-            "id": "fdOSEVl2X6AM9Oi_RNNffg",
-            "alias": "l-osteria-1396-magenta",
-            "name": "L'Osteria 1396",
-            "image_url": "",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/l-osteria-1396-magenta?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 1,
-            "categories": [
-                {
-                    "alias": "lumbard",
-                    "title": "Lumbard"
-                }
-            ],
-            "rating": 5.0,
-            "coordinates": {
-                "latitude": 45.4514046,
-                "longitude": 8.8609381
-            },
-            "transactions": [],
-            "price": "€€€",
-            "location": {
-                "address1": "Vicolo Valle 4",
-                "address2": "",
-                "address3": "",
-                "city": "Magenta",
-                "zip_code": "20013",
-                "country": "IT",
-                "state": "MI",
-                "display_address": [
-                    "Vicolo Valle 4",
-                    "20013 Magenta",
-                    "Italy"
-                ]
-            },
-            "phone": "+390297298461",
-            "display_phone": "+39 02 9729 8461",
-            "distance": 7694.853601749534
-        },
-        {
-            "id": "YTucQyNR-sPCnUXXFObxgg",
-            "alias": "la-barcella-robecco-sul-naviglio",
-            "name": "La Barcella",
-            "image_url": "https://s3-media2.fl.yelpcdn.com/bphoto/NwzbWtjWcJulxOkxt1UZcg/o.jpg",
-            "is_closed": false,
-            "url": "https://www.yelp.com/biz/la-barcella-robecco-sul-naviglio?adjust_creative=JbtuKWF0uhn_v5H2VYyFag&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=JbtuKWF0uhn_v5H2VYyFag",
-            "review_count": 3,
-            "categories": [
-                {
-                    "alias": "venues",
-                    "title": "Venues & Event Spaces"
-                },
-                {
-                    "alias": "italian",
-                    "title": "Italian"
-                }
-            ],
-            "rating": 4.0,
-            "coordinates": {
-                "latitude": 45.424721,
-                "longitude": 8.852034
-            },
-            "transactions": [],
-            "location": {
-                "address1": "Localita Casterno",
-                "address2": "",
-                "address3": "",
-                "city": "Robecco sul Naviglio",
-                "zip_code": "20087",
-                "country": "IT",
-                "state": "MI",
-                "display_address": [
-                    "Localita Casterno",
-                    "20087 Robecco sul Naviglio",
-                    "Italy"
-                ]
-            },
-            "phone": "+390294970555",
-            "display_phone": "+39 02 9497 0555",
-            "distance": 8109.259265025397
-        }
-    ],
-    "total": 103,
-    "region": {
-        "center": {
-            "longitude": 8.7615966796875,
-            "latitude": 45.46102152031082
-        }
-    }
-}
\ No newline at end of file
diff --git a/src/models.tsx b/src/models.tsx
index db20013..dcc2558 100644
--- a/src/models.tsx
+++ b/src/models.tsx
@@ -4,8 +4,9 @@ export const apiSecret = z
   .string()
   .length(128, { message: "Must be exactly 128 characters long" });
 
-export const previewProp = z
+export const previewPropApi = z
   .object({
+    id: z.string(),
     alias: z.string(),
     name: z.string(),
     rating: z.number(),
@@ -20,15 +21,39 @@ export const previewProp = z
     ...rest,
   }));
 
-export type PreviewProp = z.infer<typeof previewProp>;
+export type PreviewPropApi = z.infer<typeof previewPropApi>;
 
 export const previewList = z.object({
-  businesses: previewProp.array(),
+  businesses: previewPropApi.array(),
 });
 
 export type PreviewList = z.infer<typeof previewList>;
 
 export const filterParams = z.object({
-  range: z.number(),
+  prices: z.array(z.boolean()),
+  location: z.string(),
+  radius: z.number(),
 });
 export type FiltersParams = z.infer<typeof filterParams>;
+
+export const previewPropComponent = z.object({
+  vars: previewPropApi,
+});
+export type PreviewPropComponent = z.infer<typeof previewPropComponent>;
+
+export const detailsPropApi = z
+  .object({
+    name: z.string(),
+    rating: z.number(),
+    photos: z.array(z.string()),
+    location: z.object({
+      display_address: z.array(z.string()),
+    }),
+    price: z.string(),
+  })
+  .transform(({ location, ...rest }) => ({
+    address: location.display_address,
+    ...rest,
+  }));
+
+export type DetailsPropApi = z.infer<typeof detailsPropApi>;
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
index fb40299..3ba3e68 100644
--- a/src/pages/Home.tsx
+++ b/src/pages/Home.tsx
@@ -1,18 +1,52 @@
 import {
   Box,
   ContentWithSidebar,
-  Body,
-  Tiles,
-  AreaLoader,
+  Stack,
+  Divider,
+  Button,
   Feedback,
+  AreaLoader,
   Inset,
+  Tiles,
+  TextField,
+  SliderField,
+  CheckboxGroupField,
 } from "@buildo/bento-design-system";
+import { useGetRestaurantList } from "../hooks";
 import RestaurantPreview from "../components/RestaurantPreview";
-
-import useGetRestaurantList from "../hooks";
+import { useTranslation } from "react-i18next";
+import { validators, useFormo, success } from "@buildo/formo";
+import { useEffect } from "react";
+import { PreviewPropComponent } from "../models";
 
 function Home() {
-  const { isLoading, isError, data } = useGetRestaurantList(10);
+  const { t } = useTranslation();
+  const initialValues = {
+    prices: ["price=1", "price=2", "price=3", "price=4"],
+    location: "Milan",
+    radius: 10,
+  };
+
+  const { fieldProps, handleSubmit, values } = useFormo(
+    {
+      initialValues,
+      fieldValidators: () => ({
+        location: validators.minLength(2, "City name is too short"),
+      }),
+    },
+    {
+      onSubmit: async (values) => {
+        refetch();
+        return success(values);
+      },
+    }
+  );
+
+  useEffect(() => {
+    refetch();
+  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+
+  const { isLoading, isError, data, refetch } = useGetRestaurantList(values);
 
   if (isLoading) {
     return <AreaLoader message="Loading..."></AreaLoader>;
@@ -30,7 +64,15 @@ function Home() {
   }
 
   const cards = data?.businesses.map((element) => {
-    return <RestaurantPreview key={"home-" + element.alias} {...element} />;
+    const prevPropsComponent: PreviewPropComponent = {
+      vars: { ...element },
+    };
+    return (
+      <RestaurantPreview
+        key={"home-" + element.alias}
+        {...prevPropsComponent}
+      />
+    );
   });
   return (
     <ContentWithSidebar
@@ -38,13 +80,50 @@ function Home() {
       sidebarWidth="1/5"
       sidebarBackground="backgroundOverlay"
     >
-      <Box
-        height="full"
-        display="flex"
-        justifyContent="center"
-        alignItems="center"
-      >
-        <Body size="large">filters</Body>
+      <Box height="full" padding={24}>
+        <Stack space={16} align="left">
+          {/* price filters */}
+          <Box width="full">
+            <CheckboxGroupField
+              label={t("priceRangefilter")}
+              orientation="vertical"
+              options={[
+                { value: initialValues.prices[0], label: "€" },
+                { value: initialValues.prices[1], label: "€€" },
+                { value: initialValues.prices[2], label: "€€€" },
+                { value: initialValues.prices[3], label: "€€€€" },
+              ]}
+              {...fieldProps("prices")}
+            />
+          </Box>
+
+          <Divider />
+          {/* location filters */}
+          <TextField
+            {...fieldProps("location")}
+            label={t("Location.Label")}
+            placeholder={t("Location.Placeholder")}
+          />
+          <Divider />
+          {/* range filters */}
+          <Box width="full">
+            <SliderField
+              type="single"
+              label={t("RangeDistance.Label")}
+              minValue={0}
+              maxValue={10}
+              step={1}
+              {...fieldProps("radius")}
+            />
+          </Box>
+          <Divider />
+          <Button
+            kind="solid"
+            hierarchy="primary"
+            label={t("SearchButton")}
+            onPress={handleSubmit}
+          />
+        </Stack>
       </Box>
       <Inset space={16}>
         <Tiles
diff --git a/src/pages/RestaurantDetail.tsx b/src/pages/RestaurantDetail.tsx
new file mode 100644
index 0000000..05a9a3e
--- /dev/null
+++ b/src/pages/RestaurantDetail.tsx
@@ -0,0 +1,77 @@
+import {
+  Box,
+  Stack,
+  Title,
+  AreaLoader,
+  Columns,
+  List,
+  Feedback,
+} from "@buildo/bento-design-system";
+import { useGetRestaurantDetails } from "../hooks";
+import { useParams } from "react-router-dom";
+
+function RestaurantDetail() {
+  const { id } = useParams();
+  const { isLoading, isError, data } = useGetRestaurantDetails(id!);
+
+  if (isLoading) {
+    return <AreaLoader message="Loading..."></AreaLoader>;
+  }
+
+  if (isError) {
+    return (
+      <Feedback
+        size="medium"
+        title="Error!"
+        description="Something went wrong!"
+        status="negative"
+      />
+    );
+  }
+
+  const photos = data?.photos.map((photo) => {
+    return (
+      <img
+        key={photo}
+        src={photo}
+        alt="restaurant"
+        style={{ width: "100%", height: "100%" }}
+      />
+    );
+  });
+
+  const address = data?.address.join(", ");
+
+  return (
+    <Box height="full" padding={24}>
+      <Columns space={12}>
+        <Stack space={16} align="left">
+          <Title size="large">{data?.name}</Title>
+          <List
+            size="medium"
+            dividers
+            items={[
+              {
+                kind: "single-line",
+                label: `Rating : ${data?.rating}  ⭐ `,
+              },
+              {
+                kind: "single-line",
+                label: `Address : ${address}`,
+              },
+              {
+                kind: "single-line",
+                label: `Price : ${data?.price}`,
+              },
+            ]}
+          />
+        </Stack>
+        <Stack space={16} align="left">
+          {photos}
+        </Stack>
+      </Columns>
+    </Box>
+  );
+}
+
+export default RestaurantDetail;
diff --git a/src/utils.tsx b/src/utils.tsx
index b2944f1..d744287 100644
--- a/src/utils.tsx
+++ b/src/utils.tsx
@@ -1,10 +1,28 @@
-import { PreviewList, previewList } from "./models";
+import {
+  PreviewList,
+  previewList,
+  detailsPropApi,
+  DetailsPropApi,
+} from "./models";
 
-export function fromJsonToProp(jsonApi: JSON): PreviewList {
+export function fromJsonToPropPreview(jsonApi: JSON): PreviewList {
   const propList = previewList.safeParse(jsonApi);
   if (propList.success) {
     return propList.data;
   } else {
-    throw Error("Something went wrong with the APIs response");
+    throw Error(
+      `Something went wrong with the APIs response: ${propList.error}`
+    );
+  }
+}
+
+export function fromJsonToPropDetails(jsonApi: JSON): DetailsPropApi {
+  const propDetails = detailsPropApi.safeParse(jsonApi);
+  if (propDetails.success) {
+    return propDetails.data;
+  } else {
+    throw Error(
+      `Something went wrong with the APIs response: ${propDetails.error}`
+    );
   }
 }