feat: initial setup of tourism app

apps/tourism/.prettierignore

@@ -0,0 +1,4 @@
+/node_modules/
+/coverage/
+/.next/
+/public/

apps/tourism/Jenkinsfile

@@ -0,0 +1,29 @@
+pipeline {
+  agent any
+  stages {
+    stage('Executing Shell Script On Server') {
+      steps {
+        script {
+          sshagent(credentials: ['"${credentials}"']) {
+            sh '''
+              ssh -t -t ${userName}@${hostIP} -o StrictHostKeyChecking=no << EOF
+              ${listOfCommands}
+              logout
+              EOF
+              '''
+          }
+        }
+      }
+    }
+  }
+  post {
+    always {
+        cleanWs(cleanWhenNotBuilt: false,
+            deleteDirs: true,
+            disableDeferredWipeout: true,
+            notFailBuild: true,
+            patterns: [[pattern: '.gitignore', type: 'INCLUDE'],
+            [pattern: '.propsfile', type: 'EXCLUDE']])
+        }
+    }
+}

apps/tourism/components/BottomModal/BottomModal.tsx

@@ -0,0 +1,65 @@
+import React from 'react'
+import { Image, Box } from '@chakra-ui/react'
+import { Transition } from '@headlessui/react'
+
+interface ModalProps {
+  isOpen: boolean
+  onClose: () => void
+  children: React.ReactNode
+  partialClose?: boolean
+}
+
+const Modal: React.FC<ModalProps> = ({ isOpen, onClose, children, partialClose }) => {
+  return (
+    <Transition
+      show={isOpen}
+      onClick={() => onClose()}
+    >
+      <Box
+        position="fixed"
+        zIndex="9999"
+        inset="0"
+        display="flex"
+        alignItems="flex-end"
+        justifyContent="center"
+        padding={partialClose ? '0' : 'sm:p-0'}
+      >
+        <Transition.Child
+          unmount={false}
+          enter="transition-transform duration-300"
+          enterFrom="translate-y-full"
+          enterTo="translate-y-0"
+          leave="transition-transform duration-300"
+          leaveFrom="translate-y-0"
+          leaveTo="translate-y-full"
+          style={{
+            width: '100vw'
+          }}
+        >
+          <Box
+            width="full"
+            px="4"
+            pb="4"
+            pt="2"
+            mx="auto"
+            bg="#fff"
+            roundedTop="1rem"
+            shadow="lg"
+            overflow="hidden"
+            className="sm:rounded-lg"
+          >
+            <Image
+              src="/images/Indicator.svg"
+              mx="auto"
+              mb="3"
+              alt="indicator"
+            />
+            {children}
+          </Box>
+        </Transition.Child>
+      </Box>
+    </Transition>
+  )
+}
+
+export default Modal

apps/tourism/components/BottomModal/BottomModalScan.tsx

@@ -0,0 +1,56 @@
+import React from 'react'
+import { Image, ModalOverlay, Modal, ModalContent, Box, ModalHeader, Divider, Flex } from '@chakra-ui/react'
+
+interface ModalProps {
+  isOpen: boolean
+  onClose: () => void
+  children: React.ReactNode
+  partialClose?: boolean
+  modalHeader?: string
+}
+
+const BottomModal: React.FC<ModalProps> = ({ isOpen, onClose, children, modalHeader }) => {
+  return (
+    <>
+      <Modal
+        isCentered
+        onClose={onClose}
+        isOpen={isOpen}
+        scrollBehavior="outside"
+        motionPreset="slideInBottom"
+      >
+        <ModalOverlay height="100vh" />
+        <ModalContent
+          position="fixed"
+          bottom="0px"
+          pb="20px"
+          borderRadius="1rem 1rem 0px 0px"
+          maxW="lg"
+        >
+          <Flex
+            alignItems={'center'}
+            justifyContent={'space-between'}
+            padding={'20px 24px'}
+          >
+            <ModalHeader
+              textAlign="left"
+              fontSize="17px"
+              fontWeight={'600'}
+              p={'unset'}
+              flex={'unset'}
+            >
+              {modalHeader}
+            </ModalHeader>
+            <Box onClick={onClose}>
+              <Image src="/images/crossIcon.svg" />
+            </Box>
+          </Flex>
+          <Divider mb={'20px'} />
+          {children}
+        </ModalContent>
+      </Modal>
+    </>
+  )
+}
+
+export default BottomModal

apps/tourism/components/BottomModal/index.tsx

@@ -0,0 +1,3 @@
+import BottomModal from './BottomModal'
+
+export default BottomModal

apps/tourism/components/UI/Breadcrumb.tsx

@@ -0,0 +1,83 @@
+import React, { useEffect, useState } from 'react'
+import { useRouter } from 'next/router'
+import Link from 'next/link'
+import { IBreadcrumb } from '../../lib/types/breadcrumb'
+import { useLanguage } from '../../hooks/useLanguage'
+import { BsShop } from 'react-icons/bs'
+
+const convertBreadcrumb = (str: string) => {
+  return str.replace(/-/g, ' ').replace(/oe/g, 'ö').replace(/ae/g, 'ä').replace(/ue/g, 'ü')
+}
+
+const Breadcrumb = () => {
+  const { t } = useLanguage()
+  const router = useRouter()
+  const [breadcrumbs, setBreadcrumbs] = useState<IBreadcrumb[] | []>([])
+  useEffect(() => {
+    if (router) {
+      const paths = router.asPath.split('/')
+      paths.shift()
+
+      const pathsArray = paths.map((path, i) => {
+        return {
+          breadcrumb: path,
+          href: '/' + paths.slice(0, i + 1).join('/')
+        }
+      })
+
+      setBreadcrumbs(pathsArray)
+    }
+  }, [router])
+
+  if (!breadcrumbs) {
+    return null
+  }
+
+  return (
+    <div className="flex text-[11px] sm:text-sm text-palette-mute dark:text-slate-300 mt-4 md:-mt-4 mb-3 md:my-none overflow-auto whitespace-nowrap">
+      <nav className="flex py-3 px-2 sm:px-5 leading-6">
+        <ul className="flex items-center space-x-1 md:space-x-3">
+          <li className="cursor-pointer">
+            <Link
+              legacyBehavior
+              href="/"
+            >
+              <a className="flex ltr:pr-2 rtl:pl-2">
+                <span>
+                  <BsShop
+                    style={{
+                      fontSize: '1.2rem'
+                    }}
+                  />
+                </span>
+                <span className="ltr:ml-1 rtl:mr-1">{t.mainPage}</span>
+              </a>
+            </Link>
+          </li>
+          {breadcrumbs.map((breadcrumb, i) => {
+            return (
+              <li
+                className="flex items-center"
+                key={breadcrumb.href}
+              >
+                <span>/</span>
+                <Link
+                  legacyBehavior
+                  href={breadcrumb.href}
+                >
+                  <a className="inline-block px-2">
+                    {t[convertBreadcrumb(breadcrumb.breadcrumb)]
+                      ? t[convertBreadcrumb(breadcrumb.breadcrumb)]
+                      : convertBreadcrumb(breadcrumb.breadcrumb)}
+                  </a>
+                </Link>
+              </li>
+            )
+          })}
+        </ul>
+      </nav>
+    </div>
+  )
+}
+
+export default Breadcrumb

apps/tourism/components/UI/CarouselBox/CarouselBox.tsx

@@ -0,0 +1,108 @@
+import React from 'react'
+import Link from 'next/link'
+import { useLanguage } from '../../../hooks/useLanguage'
+import { NextArrow, PrevArrow } from './CarouselBoxArrows'
+import Slider from 'react-slick'
+import { HiOutlineChevronLeft, HiOutlineChevronRight } from 'react-icons/hi'
+
+interface Props {
+  title: string
+  className?: string
+  href?: string
+  children?: React.ReactNode
+  full?: boolean
+}
+const CarouselBox: React.FC<Props> = ({ title, className, children, href, full }) => {
+  const { t } = useLanguage()
+
+  const settings = {
+    className: ` px-4 ${full ? 'bg-palette-fill' : 'bg-[#37bccef9]'}`,
+    infinite: true,
+    speed: 600,
+    centerPadding: '60px',
+    slidesToShow: 5,
+    slidesToScroll: 5,
+    // initialSlide: 0,
+    swipeToSlide: true,
+    // rtl: true,
+    nextArrow: <NextArrow />,
+    prevArrow: <PrevArrow />,
+    responsive: [
+      {
+        breakpoint: 1324,
+        settings: {
+          slidesToShow: 4,
+          slidesToScroll: 4
+        }
+      },
+      {
+        breakpoint: 1024,
+        settings: {
+          slidesToShow: 3,
+          slidesToScroll: 3
+        }
+      },
+      {
+        breakpoint: 768,
+        settings: {
+          slidesToShow: 2,
+          slidesToScroll: 2
+        }
+      },
+      {
+        breakpoint: 640,
+        settings: {
+          slidesToShow: 1,
+          slidesToScroll: 1
+        }
+      }
+    ]
+  }
+
+  return (
+    <div className={`w-[100%] mx-auto my-8 flex rounded-md ${full ? 'flex-col' : 'bg-[#37bccef9]'}`}>
+      <div
+        className={`flex flex-col items-center justify-around flex-grow text-sm sm:text-base  bg-cover bg-no-repeat bg-center rounded-md backdrop-blur-md ${className}`}
+      >
+        <h2
+          className={`text-lg  sm:text-xl font-bold ${
+            full ? 'text-palette-base self-start' : 'text-palette-primary text-center'
+          } `}
+        >
+          {t[`${title}`]}
+        </h2>
+        {!full ? (
+          <Link
+            legacyBehavior
+            href={`/offers`}
+          >
+            <a className="text-palette-primary/80 dark:text-rose-300 text-sm font-bold py-2 px-6 -mb-4 shadow-lg block rounded-lg backdrop-filter backdrop-blur-[10px] bg-palette-card/80">
+              {t.seeAll}
+            </a>
+          </Link>
+        ) : null}
+      </div>
+      <div className={`relative ${full ? 'w-full mt-4' : 'w-[55%] sm:w-[75%] md:w-[85%]'}`}>
+        <Slider {...settings}>{children}</Slider>
+        <div>
+          <div className="absolute top-[45%] right-4 md:right-1 shadow-lg rounded-full bg-palette-card p-1 drop-shadow-lg text-[0.8rem] md:text-[1.8rem]">
+            <HiOutlineChevronRight
+              style={{
+                color: 'gray'
+              }}
+            />
+          </div>
+          <div className="absolute top-[45%] left-4 md:-left-1 shadow-lg rounded-full bg-palette-card p-1 drop-shadow-lg text-[0.8rem] md:text-[1.8rem]">
+            <HiOutlineChevronLeft
+              style={{
+                color: 'gray'
+              }}
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
+
+export default CarouselBox

apps/tourism/components/UI/CarouselBox/CarouselBoxArrows.tsx

@@ -0,0 +1,25 @@
+import React from 'react'
+
+interface Props {
+  className?: string
+  style?: any
+  onClick?: () => void
+}
+export const NextArrow: React.FC<Props> = ({ className, style, onClick }) => {
+  return (
+    <div
+      className={`${className} z-10 w-14 h-full !flex items-center justify-center ltr:left-auto ltr:-right-2 rtl:right-auto rtl:-left-2 before:text-[20px] lg:before:text-[40px] before:content-[''] hover:bg-palette-card/20 drop-shadow-xl`}
+      style={{ ...style }}
+      onClick={onClick}
+    />
+  )
+}
+export const PrevArrow: React.FC<Props> = ({ className, style, onClick }) => {
+  return (
+    <div
+      className={`${className} z-10 w-14 h-full !flex items-center justify-center ltr:-left-5 ltr:right-auto rtl:-right-5 rtl:left-auto before:text-[20px] lg:before:text-[40px] before:content-[''] hover:bg-palette-card/20 drop-shadow-lg`}
+      style={{ ...style }}
+      onClick={onClick}
+    />
+  )
+}