diff --git a/session-3/frontend/README.md b/session-3/frontend/README.md index 2bb75a4..b8b256e 100644 --- a/session-3/frontend/README.md +++ b/session-3/frontend/README.md @@ -2,7 +2,7 @@ ## Overview -This is the frontend implementation for Reviewed!. It consists of a React application that works with a Ballerina GraphQL backend. It uses the Apollo Client on the frontend to connect to the GraphQL backend. +This is the frontend implementation for `Reviewed!`. It consists of a React application that works with a Ballerina GraphQL backend. It uses the Apollo Client on the frontend to connect to the GraphQL backend. ## Get Started diff --git a/session-3/frontend/dist/assets/index-BM_9fHsE.js b/session-3/frontend/dist/assets/index-BT05fbsE.js similarity index 99% rename from session-3/frontend/dist/assets/index-BM_9fHsE.js rename to session-3/frontend/dist/assets/index-BT05fbsE.js index e44fa30..1956187 100644 --- a/session-3/frontend/dist/assets/index-BM_9fHsE.js +++ b/session-3/frontend/dist/assets/index-BT05fbsE.js @@ -302,7 +302,7 @@ this in the docs: http://dev.apollodata.com/core/fragments.html#unique-names`):s } } } -`;function gj(){const{placeId:e}=tS(),{subscribeToMore:t,error:n,loading:r,data:o}=Pm(vj,{variables:{placeId:e}});return E.jsx(qc,{children:E.jsx(Dm,{error:n,loading:r,data:o,children:o?E.jsx(bj,{place:o.place,subscribeToNewReviews:()=>{t({document:yj,variables:{placeId:o.place.id},updateQuery:(i,{subscriptionData:s})=>{if(!s.data)return i;const a=s.data.reviews;return Object.create({place:{...i.place,rating:a.place.rating,reviews:[...a.place.reviews]}})}})}}):""})})}const Lm=5,bj=({place:e,subscribeToNewReviews:t})=>{const{id:n,name:r,city:o,country:i,rating:s,reviews:a,fee:l,population:u,timezone:c}=e;return S.useEffect(()=>{t()},[]),E.jsxs(Ic,{sx:{display:"flex",flexDirection:"column",alignItems:"center",gap:"1rem",maxWidth:{sm:"40rem",md:"48rem"}},children:[E.jsx(fn,{component:"img",sx:{objectFit:"cover",width:"calc(100% + 2rem)",borderRadius:"0.5rem"},alt:r,src:Sw}),E.jsxs(fn,{sx:{display:"flex",flexDirection:"column",alignItems:"center",gap:"0.5rem",backgroundColor:"#ffffff",padding:"1rem",width:"100%",borderRadius:"0.5rem"},children:[E.jsx(Ie,{textAlign:"center",component:"h1",variant:"h1",children:r}),E.jsx(I1,{sx:{bgcolor:"primary.main",width:"100%"}}),E.jsxs(Hr,{container:!0,justifyContent:"center",children:[E.jsxs(Hr,{item:!0,xs:6,display:"flex",alignItems:"center",gap:"0.5rem",flexWrap:"wrap",children:[E.jsx(Ie,{variant:"p",children:"Location:"}),E.jsxs(Ie,{variant:"span",component:"span",color:"secondary",fontWeight:"bold",children:[o,", ",i]})]}),E.jsxs(Hr,{item:!0,xs:6,display:"flex",alignItems:"center",gap:"0.5rem",flexWrap:"wrap",children:[E.jsx(Ie,{variant:"p",children:"Rating:"}),s!==null?E.jsx(Uc,{count:Math.round(s),limit:Lm}):E.jsx(Ie,{variant:"span",component:"span",color:"secondary",fontWeight:"bold",children:"No ratings yet!"})]}),l?E.jsx(Hr,{item:!0,xs:12,children:E.jsxs(Ie,{variant:"p",children:["Fee: ",E.jsxs(Ie,{variant:"span",fontWeight:"bold",color:"secondary",fontWeight:"bold",children:["$",l]})]})}):"",E.jsx(Hr,{item:!0,xs:12,children:E.jsxs(Ie,{variant:"h5",textAlign:"center",margin:"1rem 0",fontWeight:"bold",children:["More about ",o,", ",i]})}),E.jsxs(Hr,{item:!0,xs:6,display:"flex",alignItems:"center",gap:"0.5rem",flexWrap:"wrap",children:[E.jsx(Ie,{variant:"p",children:"Population:"}),E.jsx(Ie,{variant:"span",component:"span",color:"secondary",fontWeight:"bold",children:u})]}),E.jsxs(Hr,{item:!0,xs:6,display:"flex",alignItems:"center",gap:"0.5rem",flexWrap:"wrap",children:[E.jsx(Ie,{variant:"p",children:"Time zone:"}),E.jsx(Ie,{variant:"span",component:"span",color:"secondary",fontWeight:"bold",children:c})]})]}),E.jsx(Ie,{marginTop:"2rem",textAlign:"center",component:"h4",variant:"h4",fontWeight:"bold",children:"Reviews"}),a.length===0?E.jsx(Ie,{variant:"p",component:"p",children:"No reviews yet!"}):a.map((f,d)=>E.jsx(xj,{review:f},d)),E.jsx(wj,{placeId:n})]})]})},xj=({review:e})=>{const t=zi();return E.jsx(_a,{sx:{width:"100%",":hover":{cursor:"pointer",background:"var(--primary-color-light1)"}},onClick:()=>t(`/author/${e.author.id}`),children:E.jsxs(Ra,{children:[E.jsxs(zn,{direction:"row",gap:"0.5rem",alignItems:"baseline",justifyContent:"space-between",children:[E.jsx(wi,{avatar:E.jsx(em,{children:e.author.username[0]}),variant:"outlined",color:"secondary",label:e.author.username,sx:{marginBottom:"1rem"}}),E.jsx(Uc,{count:e.rating,limit:Lm})]}),E.jsx(Ie,{gutterBottom:!0,variant:"p",component:"p",children:e.content})]})})},Sj=Un` +`;function gj(){const{placeId:e}=tS(),{subscribeToMore:t,error:n,loading:r,data:o}=Pm(vj,{variables:{placeId:e}});return E.jsx(qc,{children:E.jsx(Dm,{error:n,loading:r,data:o,children:o?E.jsx(bj,{place:o.place,subscribeToNewReviews:()=>{t({document:yj,variables:{placeId:o.place.id},updateQuery:(i,{subscriptionData:s})=>{if(!s.data)return i;const a=s.data.reviews;return Object.create({place:{...i.place,rating:a.place.rating,reviews:[...a.place.reviews]}})}})}}):""})})}const Lm=5,bj=({place:e,subscribeToNewReviews:t})=>{const{id:n,name:r,city:o,country:i,rating:s,reviews:a,fee:l,population:u,timezone:c}=e;return S.useEffect(()=>{t()},[]),E.jsxs(Ic,{sx:{display:"flex",flexDirection:"column",alignItems:"center",gap:"1rem",maxWidth:{sm:"40rem",md:"48rem"}},children:[E.jsx(fn,{component:"img",sx:{objectFit:"cover",width:"calc(100% + 2rem)",borderRadius:"0.5rem"},alt:r,src:Sw}),E.jsxs(fn,{sx:{display:"flex",flexDirection:"column",alignItems:"center",gap:"0.5rem",backgroundColor:"#ffffff",padding:"1rem",width:"100%",borderRadius:"0.5rem"},children:[E.jsx(Ie,{textAlign:"center",component:"h1",variant:"h1",children:r}),E.jsx(I1,{sx:{bgcolor:"primary.main",width:"100%"}}),E.jsxs(Hr,{container:!0,justifyContent:"center",children:[E.jsxs(Hr,{item:!0,xs:6,display:"flex",alignItems:"center",gap:"0.5rem",flexWrap:"wrap",children:[E.jsx(Ie,{variant:"p",children:"Location:"}),E.jsxs(Ie,{variant:"span",component:"span",color:"secondary",fontWeight:"bold",children:[o,", ",i]})]}),E.jsxs(Hr,{item:!0,xs:6,display:"flex",alignItems:"center",gap:"0.5rem",flexWrap:"wrap",children:[E.jsx(Ie,{variant:"p",children:"Rating:"}),s!==null?E.jsx(Uc,{count:Math.round(s),limit:Lm}):E.jsx(Ie,{variant:"span",component:"span",color:"secondary",fontWeight:"bold",children:"No ratings yet!"})]}),l?E.jsx(Hr,{item:!0,xs:12,children:E.jsxs(Ie,{variant:"p",children:["Fee: ",E.jsxs(Ie,{variant:"span",fontWeight:"bold",color:"secondary",children:["$",l]})]})}):"",E.jsx(Hr,{item:!0,xs:12,children:E.jsxs(Ie,{variant:"h5",textAlign:"center",margin:"1rem 0",fontWeight:"bold",children:["More about ",o,", ",i]})}),E.jsxs(Hr,{item:!0,xs:6,display:"flex",alignItems:"center",gap:"0.5rem",flexWrap:"wrap",children:[E.jsx(Ie,{variant:"p",children:"Population:"}),E.jsx(Ie,{variant:"span",component:"span",color:"secondary",fontWeight:"bold",children:u})]}),E.jsxs(Hr,{item:!0,xs:6,display:"flex",alignItems:"center",gap:"0.5rem",flexWrap:"wrap",children:[E.jsx(Ie,{variant:"p",children:"Time zone:"}),E.jsx(Ie,{variant:"span",component:"span",color:"secondary",fontWeight:"bold",children:c})]})]}),E.jsx(Ie,{marginTop:"2rem",textAlign:"center",component:"h4",variant:"h4",fontWeight:"bold",children:"Reviews"}),a.length===0?E.jsx(Ie,{variant:"p",component:"p",children:"No reviews yet!"}):a.map((f,d)=>E.jsx(xj,{review:f},d)),E.jsx(wj,{placeId:n})]})]})},xj=({review:e})=>{const t=zi();return E.jsx(_a,{sx:{width:"100%",":hover":{cursor:"pointer",background:"var(--primary-color-light1)"}},onClick:()=>t(`/author/${e.author.id}`),children:E.jsxs(Ra,{children:[E.jsxs(zn,{direction:"row",gap:"0.5rem",alignItems:"baseline",justifyContent:"space-between",children:[E.jsx(wi,{avatar:E.jsx(em,{children:e.author.username[0]}),variant:"outlined",color:"secondary",label:e.author.username,sx:{marginBottom:"1rem"}}),E.jsx(Uc,{count:e.rating,limit:Lm})]}),E.jsx(Ie,{gutterBottom:!0,variant:"p",component:"p",children:e.content})]})})},Sj=Un` mutation addReview($rating: Int!, $reviewContent: String!, $placeId: Int!) { addReview( reviewInput: { diff --git a/session-3/frontend/dist/index.html b/session-3/frontend/dist/index.html index 9bf807a..da6ec3b 100644 --- a/session-3/frontend/dist/index.html +++ b/session-3/frontend/dist/index.html @@ -6,7 +6,7 @@ Reviewed! - + diff --git a/session-3/frontend/src/pages/PlacePage.jsx b/session-3/frontend/src/pages/PlacePage.jsx index 6558cc3..46ceb76 100644 --- a/session-3/frontend/src/pages/PlacePage.jsx +++ b/session-3/frontend/src/pages/PlacePage.jsx @@ -212,7 +212,7 @@ const PlaceDetails = ({ place, subscribeToNewReviews }) => { {fee ? - Fee: ${fee} + Fee: ${fee} : ""}