@campxdev/shared 1.11.66 → 1.11.68

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@campxdev/shared",
-  "version": "1.11.66",
+  "version": "1.11.68",
   "main": "./exports.ts",
   "scripts": {
     "start": "react-scripts start",

package/src/components/ActivityLog/ActivityLog.tsx

@@ -39,7 +39,7 @@ export default function ActivityLog({
   const fetchActivities = async ({ pageParam = 0 }) => {
     try {
       const response = await axios.get(endPoint, { params: { ...params } })
-      return response.data
+      return response?.data
     } catch (error) {
       // eslint-disable-next-line no-console
       console.log(error)
@@ -54,11 +54,11 @@ export default function ActivityLog({
       },
     })
 
-  const activitesData = data ? data?.pages.flatMap((page) => page) : []
+  const activitesData = data ? data?.pages?.flatMap((page) => page) : []
 
   if (isLoading) return <Spinner />
 
-  if (data.pages.length === 0 || !activitesData.length) {
+  if (data?.pages?.length === 0 || !activitesData?.length) {
     return (
       <NoDataIllustration
         imageSrc=""
@@ -122,7 +122,7 @@ const columns = [
     dataIndex: 'timestamp',
     key: 'timestamp',
     render: (timestamp) =>
-      moment.utc(timestamp).local().format('DD MMM YYYY - hh:mm A'),
+      moment.utc(timestamp)?.local().format('DD MMM YYYY - hh:mm A'),
   },
   {
     title: 'Action',
@@ -140,7 +140,7 @@ const columns = [
     key: 'message',
     render: (message) => (
       <Typography sx={{ fontSize: '16px' }} variant="subtitle1">
-        {message?.split("'").map((text: string, index: number) =>
+        {message?.split("'")?.map((text: string, index: number) =>
           index % 2 === 0 ? (
             <span key={index}>{text}</span>
           ) : (
@@ -184,7 +184,7 @@ export const TimeLineComponent = ({
               <StyledTimeLineDot>
                 <StyledCircleIcon />
               </StyledTimeLineDot>
-              {index < activitesData.length - 1 && (
+              {index < activitesData?.length - 1 && (
                 <Box
                   sx={{
                     width: '1px',
@@ -205,18 +205,20 @@ export const TimeLineComponent = ({
                     .format('DD MMM YYYY - hh:mm A')}
                 </Typography>
                 <Typography sx={{ fontSize: '16px' }} variant="subtitle1">
-                  {item?.message.split("'").map((text: string, index: number) =>
-                    index % 2 === 0 ? (
-                      <span key={index}>{text}</span>
-                    ) : (
-                      <Typography
-                        key={index}
-                        sx={{ display: 'inline', fontWeight: 900 }}
-                      >
-                        {text}
-                      </Typography>
-                    ),
-                  )}
+                  {item?.message
+                    ?.split("'")
+                    ?.map((text: string, index: number) =>
+                      index % 2 === 0 ? (
+                        <span key={index}>{text}</span>
+                      ) : (
+                        <Typography
+                          key={index}
+                          sx={{ display: 'inline', fontWeight: 900 }}
+                        >
+                          {text}
+                        </Typography>
+                      ),
+                    )}
                 </Typography>
                 <Typography
                   style={{
@@ -226,7 +228,7 @@ export const TimeLineComponent = ({
                   }}
                 >
                   <StyledAvatar>
-                    {item?.userName.charAt(0).toUpperCase()}
+                    {item?.userName?.charAt(0)?.toUpperCase()}
                   </StyledAvatar>
                   <Typography sx={{ fontSize: '13px', fontWeight: 900 }}>
                     {item?.userName}
@@ -235,7 +237,7 @@ export const TimeLineComponent = ({
               </Box>
             </TimelineContent>
           </TimelineItem>
-          {isFetchingNextPage && index === items.length - 1 && hasNextPage && (
+          {isFetchingNextPage && index === items?.length - 1 && hasNextPage && (
             <StyledSpinnerBox>
               <Spinner />
             </StyledSpinnerBox>
@@ -253,11 +255,11 @@ function useIntersectionObserver<T extends HTMLDivElement>(
 
   const handleObserver = useCallback(
     (node: T) => {
-      if (observer.current) observer.current.disconnect()
+      if (observer?.current) observer?.current?.disconnect()
       observer.current = new IntersectionObserver((entries) => {
-        if (entries[0].isIntersecting) callback()
+        if (entries[0]?.isIntersecting) callback()
       })
-      if (node) observer.current.observe(node)
+      if (node) observer?.current?.observe(node)
     },
     [callback],
   )

package/src/constants/UIConstants.ts

@@ -1,8 +1,8 @@
 import { ReactNode } from 'react'
 
 export const batchOptions = Array.from({ length: 12 }, (_, i) => {
-  return `${2012 + i} - ${2012 + i + 1}`
-}).reverse()
+  return `${new Date().getFullYear() - i} - ${new Date().getFullYear() - i + 1}`
+})
 
 export const getYears = () => {
   const start = 2019

package/src/theme/theme.d.ts

@@ -2,37 +2,48 @@ import { ThemeOptions as MuiThemeOptions } from '@mui/material/styles'
 
 declare module '@mui/material/styles' {
   interface Theme {
-    borders: {
-      grayLight: string
-      primary: string
+    borders?: {
+      grayLight?: string
+      primary?: string
     }
-    palette: {
-      primary: {
-        dark: string
-        main: string
-        light: string
-        lighter: string
-      }
-      secondary: {
-        main: string
-        light: string
-        dark: string
-        lighter: string
-      }
-      common: {
-        black: string
-        white: string
-        green: string
-        yellow: string
-        blue: string
-      }
-      error: {
-        main: string
-      }
-      text: {
-        primary: string
-        secondary: string
-        disabled: string
+    palette?: {
+      mode?: string
+      primary?: {
+        dark?: string
+        main?: string
+        light?: string
+        lighter?: string
+      }
+      secondary?: {
+        main?: string
+        light?: string
+        dark?: string
+        lighter?: string
+      }
+      highlight?: {
+        main?: string
+      }
+      grey?: {
+        main?: string
+      }
+      common?: {
+        black?: string
+        white?: string
+        green?: string
+        yellow?: string
+        blue?: string
+      }
+      error?: {
+        main?: string
+      }
+      text?: {
+        primary?: string
+        secondary?: string
+        disabled?: string
+      }
+      background?: {
+        paper?: string
+        default?: string
       }
     }
   }
@@ -40,20 +51,28 @@ declare module '@mui/material/styles' {
   interface CustomThemeOptions extends MuiThemeOptions {
     borders?: {
       grayLight?: string
+      primary?: string
     }
-    palette: {
-      secondary?: {
+    palette?: {
+      mode?: string
+      primary?: {
+        dark?: string
         main?: string
         light?: string
-        dark?: string
         lighter?: string
       }
-      primary?: {
-        dark?: string
+      secondary?: {
         main?: string
         light?: string
+        dark?: string
         lighter?: string
       }
+      highlight?: {
+        main?: string
+      }
+      grey?: {
+        main?: string
+      }
       common?: {
         black?: string
         white?: string
@@ -69,9 +88,21 @@ declare module '@mui/material/styles' {
         secondary?: string
         disabled?: string
       }
+      background?: {
+        paper?: string
+        default?: string
+      }
     }
     components?: Components<Omit<Theme, 'components'>>
     typography?: TypographyOptions | ((palette: Palette) => TypographyOptions)
   }
   export function createTheme(options?: CustomThemeOptions): CustomTheme
 }
+
+declare module '@mui/material/Typography' {
+  interface TypographyPropsVariantOverrides {
+    label1: true
+    label2: true
+    subtitle3: true
+  }
+}