iceholidays-frontend 0.12.0 → 0.13.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: a3ec38ae7c3d23dd0728bb4db5695e9ce2a59be9d3ec5b4318b57b2bdef2883d
-  data.tar.gz: 786da9eb7f5a1242153cb409a080dec4645ab22040dd0efd1af221b130fa279e
+  metadata.gz: 136d050f210efcff32751ee80c8099c596704f0824dcb8bd77b6ba9877988d45
+  data.tar.gz: d3787e03aa547be81ff6f061b1ec577d198377bcf57f347c7c5689a425a2de28
 SHA512:
-  metadata.gz: 50e8ad6881de2f85f52f003517f290beabb02725320821b689236fa31cc144115d9317f6eeffe4be1cdbeac878698de10c772c29a300d8ecc4a39879cca5f951
-  data.tar.gz: adbae28d5c2eb0a3d1e59163d21e11913592b52b45f5b2e78ade3f2f363a64e67cb81a92bc38e908a9fb54eab02b921ad4276ae67ccbac061ee7acdee3b19991
+  metadata.gz: e18e8800b9fa3bc7d3b526b83fc9d265ccec3c79527462796452e8779c04ced9b80460043aa42e36af54726e177466f3301e1ff62486b4eb516f32b781a045b8
+  data.tar.gz: d67d2b77a7e6d5800572ab99ed532f2d9e4fa409d5be0ab82dcede2990e557f3f7b970534d44e2b28a79990473c02c772e53234633b5186a29ba8a21a58ed124

data/app/javascript/api-services/contact-us-api.service.ts

@@ -5,8 +5,18 @@ class ContactUsApi
 
   contactInquiry(formValues){
     const apiUrl = "/api/v1/inquiries";
-
-    return axios.post(apiUrl, {inquiry: formValues})
+    const csrfToken = document.head.querySelector('meta[name="csrf-token"]')?.getAttribute("content");
+
+    return axios.post(
+      apiUrl, 
+      {inquiry: formValues},
+      {
+        headers: {
+          'Content-Type': 'application/json',
+          'X-CSRF-Token': csrfToken
+        },
+      }
+    )
     .then(response => {
       const ok = response.status == 200;
       return Promise.resolve(ok);

data/app/javascript/react/App.tsx

@@ -15,16 +15,16 @@ export default function App() {
   return (
     <BrowserRouter>
       <Routes>
-       <Route path="/app" element={<MainLayout />}>
+       <Route path="/web" element={<MainLayout />}>
           <Route index element={<Homepage />} />
-          <Route path="/app/listing" element={<ListingPage />} />
-          <Route path="/app/itinerary/:id" element={<ShowPage />} />
-          <Route path="/app/about-us" element={<AboutUsPage />} />
-          <Route path="/app/countries" element={<CountriesPage />} />
-          <Route path="/app/blog" element={<BlogPage />} />
-          <Route path="/app/blog/:id" element={<BlogShowPage />} />
-          <Route path="/app/contact-agents" element={<ContactAgentsPage />} />
-          <Route path="/app/contact-us" element={<ContactUsPage />} />
+          <Route path="/web/listing" element={<ListingPage />} />
+          <Route path="/web/itinerary/:id" element={<ShowPage />} />
+          <Route path="/web/about-us" element={<AboutUsPage />} />
+          <Route path="/web/countries" element={<CountriesPage />} />
+          <Route path="/web/blog" element={<BlogPage />} />
+          <Route path="/web/blog/:id" element={<BlogShowPage />} />
+          <Route path="/web/contact-agents" element={<ContactAgentsPage />} />
+          <Route path="/web/contact-us" element={<ContactUsPage />} />
         </Route>
       </Routes>
     </BrowserRouter>

data/app/javascript/react/components/Destinations.tsx

@@ -47,7 +47,7 @@ export default class Destinations extends React.Component {
       `${count} ${noun}${count > 1 ? suffix : ''}`;
 
     const listingLink = (locationId: number) => {
-      return `/app/listing?location_id=${locationId}`;
+      return `/web/listing?location_id=${locationId}`;
     }
 
 

data/app/javascript/react/components/shared/LocationPostcards.tsx

@@ -1,19 +1,17 @@
-import React from "react";
+import React, { FC } from "react";
 import { Link } from "react-router-dom";
 import { mdiMenuRight } from "@mdi/js";
 import Icon from "@mdi/react";
-import { Location } from "../../../interfaces/country.interface";
+import { City, Location } from "../../../interfaces/country.interface";
 
+interface PostcardProps {
+  link: string;
+  image: string | undefined;
+  name: string;
+  tourCount: number | undefined;
+}
 
-const Postcard = (
-  props: {
-    link: string;
-    image: string;
-    name: string;
-    tourCount: number;
-  }
-) => {
-  const { link, image, name, tourCount } = props;
+const Postcard: FC<PostcardProps> = ( {tourCount = 0, link, image, name}) => {
 
   const pluralize = (count: number, noun: string, suffix = 's') =>
     `${count} ${noun}${count > 1 ? suffix : ''}`;
@@ -37,13 +35,13 @@ const LocationPostcards = (
   const { locations } = props;
 
   const listingLink = (locationId: number) => {
-    return `/app/listing?location_id=${locationId}`;
+    return `/web/listing?location_id=${locationId}`;
   }
 
   return (
     <div className="postcards">
       {
-        locations.map((city, index)=><Postcard key={index} link={listingLink(city.id)} image={city.cover} name={city.name} tourCount={city.tourCount}/>)
+        locations.map((city:City, index)=><Postcard key={index} link={listingLink(city.id)} image={city.cover} name={city.name} tourCount={city.tourCount}/>)
       }
     </div>
   )

data/app/javascript/react/layouts/MainFooter.tsx

@@ -20,7 +20,7 @@ export default class MainFooter extends React.Component<IMainFooterProps> {
   menus = [
     {
       label: "Home",
-      link: "/app"
+      link: "/web"
     },
     {
       label: "pdpa",
@@ -29,7 +29,7 @@ export default class MainFooter extends React.Component<IMainFooterProps> {
     },
     {
       label: "about us",
-      link: "/app/about-us"
+      link: "/web/about-us"
     },
     {
       label: "privacy policy",
@@ -38,7 +38,7 @@ export default class MainFooter extends React.Component<IMainFooterProps> {
     },
     {
       label: "contact us",
-      link: "/app/contact-us"
+      link: "/web/contact-us"
     },
     {
       label: "terms & conditions",
@@ -66,7 +66,7 @@ export default class MainFooter extends React.Component<IMainFooterProps> {
               <div className="link-group-title">Countries</div>
               <div className="link-group-items">
                 {
-                  this.state.countries.map((country: Country)=> <a key={country.id} href={`/app/listing?location_id=${country.id}`} target="_self"> {country.name} </a> )
+                  this.state.countries.map((country: Country)=> <a key={country.id} href={`/web/listing?location_id=${country.id}`} target="_self"> {country.name} </a> )
                 }
               </div>
             </Space>
@@ -84,7 +84,7 @@ export default class MainFooter extends React.Component<IMainFooterProps> {
             <Space direction="vertical" align="center">
               <Flex vertical gap="20px" align="center">
                 <div className="link-group-title">Contact Us</div>
-                <div><a href="/app/contact-agents">contact agents</a></div>
+                <div><a href="/web/contact-agents">contact agents</a></div>
                 <div className="link-group-title">Follow us on</div>
                 <Flex gap={20} justify="space-between" className="social-icons">  
                   <a target="_blank" href="https://www.facebook.com/thesignaturetour"><img src="/iceholidays-assets/images/social/ico_fb.png"/></a>

data/app/javascript/react/layouts/MainHeader.tsx

@@ -21,19 +21,19 @@ class MainHeader extends React.Component <{location}> {
   items: MenuItem[] = [
     {
       key: 'app',
-      label: <Link to="/app"> Home </Link>
+      label: <Link to="/web"> Home </Link>
     },
     {
       key: 'about-us',
-      label: <Link to="/app/about-us"> About Us </Link>
+      label: <Link to="/web/about-us"> About Us </Link>
     },
     {
       key: 'countries',
-      label: <Link to="/app/countries"> Countries </Link>
+      label: <Link to="/web/countries"> Countries </Link>
     },
     {
       key: 'blog',
-      label: <Link to="/app/blog"> Blog </Link>
+      label: <Link to="/web/blog"> Blog </Link>
     },
     {
       key: 'logo',
@@ -42,11 +42,11 @@ class MainHeader extends React.Component <{location}> {
     },
     {
       key: 'contact-agents',
-      label: <Link to="/app/contact-agents"> Contact Agents </Link>
+      label: <Link to="/web/contact-agents"> Contact Agents </Link>
     },
     {
       key: 'contact-us',
-      label: <Link to="/app/contact-us"> Contact Us </Link>
+      label: <Link to="/web/contact-us"> Contact Us </Link>
     },
     {
       key: 'brochure',
@@ -115,7 +115,7 @@ class MainHeader extends React.Component <{location}> {
       <div id="main-header">
         <Menu mode="horizontal" items={this.items} onClick={this.onClick} selectedKeys={[current]} className="nav-menu"/>
   
-        <a href="/app"><img src="/iceholidays-assets/images/logo_mobile.png" className="logo logo_mobile"/></a>
+        <a href="/web"><img src="/iceholidays-assets/images/logo_mobile.png" className="logo logo_mobile"/></a>
   
         <div id="nav-buttons">
           <Button onClick={()=>this.downloadBrochure()} className="get-brochure" id="get-brochure-mobile" type="primary"><Icon path={mdiFileDownload} size="18px" /> get brochure</Button>

data/app/javascript/react/pages/BlogPage.tsx

@@ -11,8 +11,8 @@ const { Meta } = Card;
 
 const bannerPath = '/iceholidays-assets/images/blog.png';
 const _breadcrumbs = [
-  { title: <a href="/app">Home</a> },
-  { title: <a href="/app/blog">Blog</a> }
+  { title: <a href="/web">Home</a> },
+  { title: <a href="/web/blog">Blog</a> }
 ] 
 
 const types = [ {type: "News", label: "News"},{type: "Blogs", label:"Blogs"} ];
@@ -80,7 +80,7 @@ export default class BlogPage extends React.Component {
                               <Markdown remarkPlugins={[remarkGfm]} rehypePlugins={[rehypeRaw]}>{blog.content}</Markdown>
                             </div>
 
-                            <Button className="view-blog" href={`/app/blog/${blog.id}`} type="link" color="primary" variant="outlined" block>阅读更多</Button>
+                            <Button className="view-blog" href={`/web/blog/${blog.id}`} type="link" color="primary" variant="outlined" block>阅读更多</Button>
                           </>
                         } />
                     </Card>

data/app/javascript/react/pages/ListingPage.tsx

@@ -48,7 +48,7 @@ class ListingPage extends React.Component <{searchParams}> {
     searchParamsObj: {keyword: "", year: "", month: "", location_id: null},
     itineraries: [],
     location: {name: "", cover: ""},
-    breadcrumbs: [{ title: <a href="/app">Home</a> }],
+    breadcrumbs: [{ title: <a href="/web">Home</a> }],
     descriptionModalOpen: false,
     itineraryModalOpen: false,
     dateModalOpen: false,
@@ -103,7 +103,7 @@ class ListingPage extends React.Component <{searchParams}> {
 
   getLocation(locationId){
     //resets the breadcrumbs
-    this.setState({breadcrumbs: [{ title: <a href="/app">Home</a> }]});
+    this.setState({breadcrumbs: [{ title: <a href="/web">Home</a> }]});
 
     this.locationsApi.getLocation(locationId)
       .then(locationData => {
@@ -272,7 +272,7 @@ class ListingPage extends React.Component <{searchParams}> {
                                 <span className="price">{itinerary.priceCurrency} {itinerary.price}</span>
                                 <span>All In</span>
                               </Flex>
-                              <Link className="select-tour" to={`/app/itinerary/${itinerary.id}`}>Select</Link>
+                              <Link className="select-tour" to={`/web/itinerary/${itinerary.id}`}>Select</Link>
                             </Space>
                           </div>
                         </Col>

data/app/javascript/react/widgets/SearchBarWidget.tsx

@@ -21,12 +21,12 @@ function SearchBarWidget() {
     }
     
     const searchParams = new URLSearchParams(searchObj).toString();
-    navigate(`/app/listing?${searchParams}`);
+    navigate(`/web/listing?${searchParams}`);
     navigate(0);
 
     // searchApi.search(formValues.keyword, formValues.month)
     //   .then(result => {
-    //       navigate(`/app/listing?keyword=${formValues.keyword}`);
+    //       navigate(`/web/listing?keyword=${formValues.keyword}`);
     //   })
   }
   

data/lib/iceholidays/frontend/version.rb

@@ -1,5 +1,5 @@
 module Iceholidays
   module Frontend
-    VERSION = "0.12.0"
+    VERSION = "0.13.0"
   end
 end