Merge pull request js-template#41 from js-template/ci-test

Update tsconfig.json

.github/workflows/ci.yml

@@ -1,21 +1,61 @@
-name: CI
+# name: Padma CI
 
-on:
-  push:
-    branches: [dev]  # Change this to your dev branch
-  pull_request:
-    branches: [dev]  # Change this to your dev branch
+# on:
+#   push:
+#     branches:
+#       - dev # Adjust according to your branch
+#   pull_request:
+#     branches:
+#       - dev # Adjust according to your branch
 
-jobs:
-  build:
-    runs-on: ubuntu-latest
+# jobs:
+#   build:
+#     runs-on: ubuntu-latest
+#     steps:
+#       - name: Checkout Code
+#         uses: actions/checkout@v2
 
-    steps:
-      - name: Checkout Code
-        uses: actions/checkout@v2
+#       - name: Setup Node.js
+#         uses: actions/setup-node@v2
+#         with:
+#           node-version: "20"
 
-      - name: Install Dependencies
-        run: pnpm install
+#       - name: Install pnpm
+#         run: |
+#           npm install -g pnpm
 
-      - name: Build
-        run: pnpm build
+#       - name: Install Dependencies
+#         run: pnpm install
+
+#       - name: Build Backend
+#         run: pnpm -F @padma/backend build
+
+#       - name: Install  Blank Theme
+#         run: pnpm -F @padma/blank-theme build
+
+#       - name: Build Frontend
+#         run: pnpm -F @padma/frontend build
+#         env:
+#           NEXTAUTH_URL: ${{ secrets.NEXTAUTH_URL }} # Your Vercel URL
+#           NEXT_PUBLIC_BASE_URL: ${{ secrets.NEXT_PUBLIC_BASE_URL }} # Localhost or staging URL
+#           NEXT_PUBLIC_GOOGLE_MAPS_API_KEY: ${{ secrets.NEXT_PUBLIC_GOOGLE_MAPS_API_KEY }} # Google Maps API key
+#           NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY: ${{ secrets.NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY }} # Stripe API key
+#           STRAPI_AUTH_TOKEN: ${{ secrets.STRAPI_AUTH_TOKEN }} # Strapi auth token
+#           STRAPI_ENDPOINT: ${{ secrets.STRAPI_ENDPOINT }} # Strapi production URL
+
+#       - name: Deploy Backend
+#         run: |
+#           echo "Deploying backend..."
+#           # Add your backend deployment commands here
+#         env:
+#           # Add environment variables needed for deployment
+#           NODE_ENV: development
+#           # Add other necessary secrets here
+
+#       - name: Deploy Frontend
+#         run: |
+#           echo "Deploying frontend..."
+#           # Add your frontend deployment commands here
+#         env:
+#           NODE_ENV: development
+#           # Add other necessary secrets here

apps/site/config/theme-loader.ts

@@ -4,7 +4,8 @@ let activeThemeComponents: Record<string, any> = {} // Use 'any' for React compo
 
 // Load the active theme components
 export const loadActiveTheme = async () => {
-   const { getPublicComponents, getPrivateComponents } = await import("@padma/metajob-ui") // Use the activeTheme variable
+   // @ts-ignore
+   const { getPublicComponents, getPrivateComponents } = await import("@padma/blank-theme") // Use the activeTheme variable
 
    // Set the activeThemeComponents to the loaded components
    const activeThemeComponents = getPublicComponents

apps/site/package.json

@@ -24,7 +24,6 @@
       "@mui/material": "^5.15.10",
       "@mui/material-nextjs": "latest",
       "@padma/blank-theme": "workspace:*",
-      "@padma/metajob-ui": "workspace:*",
       "@strapi/blocks-react-renderer": "^1.0.1",
       "@types/lodash": "^4.14.202",
       "cookies-next": "^4.2.1",

apps/site/src/app/(public)/layout.tsx

@@ -1,6 +1,6 @@
 import React from "react"
 import { find } from "@/lib/strapi"
-import { loadActiveTheme } from "config/theme-loader"
+import { loadActiveTheme } from "../../../config/theme-loader"
 import LayoutBody from "./LayoutBody"
 import { getLanguageFromCookie } from "@/utils/language"
 

apps/site/src/app/(public)/login/body.tsx

@@ -2,8 +2,10 @@
 import { useEffect, useState } from "react"
 import { signIn, useSession } from "next-auth/react"
 import toast from "react-hot-toast"
-import { LoginCard, PageLoader } from "@padma/metajob-ui"
+
 import { useRouter } from "next/navigation"
+import { PageLoader } from "@/components/loader/pageLoader"
+import { LoginCard } from "@/components/login-card"
 
 const LoginBody = ({ callbackUrl, error }: { error: string | undefined; callbackUrl: string | undefined }) => {
    const { status } = useSession()

apps/site/src/app/(public)/page.tsx

@@ -3,7 +3,7 @@ import type { Metadata } from "next"
 import { find } from "@/lib/strapi"
 import { StrapiSeoFormate } from "@/lib/strapiSeo"
 import { getLanguageFromCookie } from "@/utils/language"
-import { getPublicComponents } from "@padma/metajob-ui"
+import { loadActiveTheme } from "config/theme-loader"
 
 export default async function Home() {
    const language = getLanguageFromCookie()
@@ -17,6 +17,7 @@ export default async function Home() {
       },
       "no-store"
    )
+   const { getPublicComponents } = await loadActiveTheme()
 
    // if (error) {
    //    throw error;

apps/site/src/app/(public)/register/body.tsx

@@ -4,7 +4,8 @@ import { signIn, useSession } from "next-auth/react"
 import { SignUp } from "@/lib/user"
 import { useRouter } from "next/navigation"
 import toast from "react-hot-toast"
-import { PageLoader, SignUpCard } from "@padma/metajob-ui"
+import { PageLoader } from "@/components/loader/pageLoader"
+import { SignUpCard } from "@/components/signup-card"
 
 const RegisterBody = () => {
    const router = useRouter()

apps/site/src/components/common/card/index.tsx

@@ -0,0 +1,23 @@
+"use client"
+import { Stack, StackProps, SxProps, Theme } from "@mui/material"
+import React from "react"
+
+type CardProps = StackProps & {
+   children: React.ReactNode
+   sx?: SxProps<Theme>
+}
+
+export function Card({ children, sx, ...rest }: CardProps) {
+   return (
+      <Stack
+         sx={{
+            bgcolor: (theme) => theme.palette.background.paper,
+            p: 1,
+            borderRadius: "1rem",
+            ...sx
+         }}
+         {...rest}>
+         {children}
+      </Stack>
+   )
+}

apps/site/src/components/common/go-back-btn/index.tsx

@@ -0,0 +1,11 @@
+"use client"
+
+import { Button } from "@mui/material"
+
+// import { Button } from "@mui/material";
+
+const GoBackBtn = () => {
+   return <Button onClick={() => window.history.back()}>Go Back</Button>
+}
+
+export default GoBackBtn

apps/site/src/components/common/icon/index.tsx

@@ -0,0 +1,61 @@
+"use client"
+import { Icon, IconProps } from "@iconify/react"
+import { Box, BoxProps } from "@mui/material"
+type CIconProps = {
+   color?: string
+   hoverColor?: string
+   size?: number
+   icon: string
+   sx?: BoxProps["sx"]
+   iconProps?: IconProps
+} & BoxProps
+export default function CIcon({ color, hoverColor, size = 24, icon, sx, iconProps, ...props }: CIconProps) {
+   return (
+      <Box
+         sx={{
+            color: color ? color : (theme) => theme.palette.text.secondary,
+            fontSize: size,
+            "&:hover": {
+               color: hoverColor
+            },
+            p: 0,
+            m: 0,
+            component: "span",
+            justifyContent: "center",
+            alignItems: "center",
+            display: "flex",
+            ...sx
+         }}
+         {...props}>
+         <Icon icon={icon} {...iconProps} />
+      </Box>
+   )
+}
+
+import type { SVGProps } from "react"
+
+export function SpinnersClock(props: SVGProps<SVGSVGElement>) {
+   return (
+      <svg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24' {...props}>
+         <path
+            fill='currentColor'
+            d='M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm0,20a9,9,0,1,1,9-9A9,9,0,0,1,12,21Z'></path>
+         <rect width={2} height={7} x={11} y={6} fill='currentColor' rx={1}>
+            <animateTransform
+               attributeName='transform'
+               dur='9s'
+               repeatCount='indefinite'
+               type='rotate'
+               values='0 12 12;360 12 12'></animateTransform>
+         </rect>
+         <rect width={2} height={9} x={11} y={11} fill='currentColor' rx={1}>
+            <animateTransform
+               attributeName='transform'
+               dur='0.75s'
+               repeatCount='indefinite'
+               type='rotate'
+               values='0 12 12;360 12 12'></animateTransform>
+         </rect>
+      </svg>
+   )
+}

apps/site/src/components/common/public-page-header/index.tsx

@@ -0,0 +1,49 @@
+"use client"
+import { hexToRGBA } from "../../../lib/hex-to-rgba"
+import { Stack, Typography } from "@mui/material"
+import { useTheme } from "next-themes"
+
+export default function PageHeader({ title }: { title: string }) {
+   const { theme: mode } = useTheme()
+   return (
+      <Stack position={"relative"}>
+         <Stack
+            sx={{
+               display: "flex",
+               flexDirection: "column",
+               justifyContent: "center",
+               alignItems: "center",
+               backgroundImage: "url(/images/jobs/findJob.png)",
+               backgroundSize: "cover",
+               backgroundPosition: "center",
+               textAlign: "center",
+               padding: "6rem 2rem",
+               "&::before": {
+                  content: '""',
+                  position: "absolute",
+                  top: 0,
+                  left: 0,
+                  right: 0,
+                  bottom: 0,
+                  backgroundColor:
+                     mode === "light"
+                        ? (theme) => hexToRGBA(theme.palette.primary.main, 0.7)
+                        : (theme) => hexToRGBA(theme.palette.background.paper, 0.7),
+                  zIndex: 1
+               },
+               "& > *": {
+                  position: "relative",
+                  zIndex: 2
+               }
+            }}>
+            <Typography
+               fontSize={{ sm: 48, xs: 32 }}
+               fontWeight={{ sm: 700, xs: 600 }}
+               variant={"h1"}
+               color={(theme) => theme.palette.primary.contrastText}>
+               {title}
+            </Typography>
+         </Stack>
+      </Stack>
+   )
+}

apps/site/src/components/common/salary-rang-slider/index.tsx

@@ -0,0 +1,99 @@
+"use client"
+import { Stack, TextField, Typography } from "@mui/material"
+import Slider from "@mui/material/Slider"
+import * as React from "react"
+import CIcon from "../icon"
+
+function valuetext(value: number) {
+   return `${value}°C`
+}
+
+export default function RangeSlider() {
+   const [value, setValue] = React.useState<number[]>([0, 50])
+
+   const handleChange = (event: Event, newValue: number | number[]) => {
+      setValue(newValue as number[])
+   }
+
+   const handleMinInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+      const newMin = parseInt(event.target.value, 10)
+      if (!isNaN(newMin)) {
+         setValue([newMin, value[1]])
+      }
+   }
+
+   const handleMaxInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+      const newMax = parseInt(event.target.value, 10)
+      if (!isNaN(newMax)) {
+         setValue([value[0], newMax])
+      }
+   }
+   return (
+      <Stack spacing={2}>
+         <Stack direction={"row"} justifyItems={"center"} justifyContent={"space-between"}>
+            <Typography fontSize={16} fontWeight={700} color={"dark.main"}>
+               Salary Range
+            </Typography>
+            <CIcon icon='clarity:minus-line' />
+         </Stack>
+         <Slider
+            getAriaLabel={() => "Temperature range"}
+            value={value}
+            onChange={handleChange}
+            valueLabelDisplay='auto'
+            getAriaValueText={valuetext}
+         />
+         <Stack direction={"row"} justifyContent={"space-between"}>
+            <TextField
+               value={value[0]}
+               type='number'
+               InputProps={{
+                  startAdornment: (
+                     <Typography fontSize={16} color='gray_1.main' fontWeight={400} pr={1}>
+                        $
+                     </Typography>
+                  ),
+                  inputProps: {
+                     min: 0, // Minimum value
+                     max: 100, // Maximum value
+                     step: 1 // Increment step
+                  }
+               }}
+               sx={{
+                  "& .MuiOutlinedInput-root": {
+                     "& .MuiInputBase-input": {
+                        color: "gray_4.main"
+                     }
+                  }
+               }}
+               onChange={handleMinInputChange}
+            />
+
+            <TextField
+               value={value[1]}
+               type='number'
+               InputProps={{
+                  inputProps: {
+                     min: 0,
+                     max: 100,
+                     step: 1
+                  },
+                  startAdornment: (
+                     <Typography fontSize={16} color='gray_1.main' fontWeight={400} pr={1}>
+                        $
+                     </Typography>
+                  )
+               }}
+               sx={{
+                  "& .MuiOutlinedInput-root": {
+                     "& .MuiInputBase-input": {
+                        color: "gray_4.main"
+                     }
+                  }
+               }}
+               onChange={handleMaxInputChange}
+            />
+         </Stack>
+      </Stack>
+   )
+}