@campxdev/shared 1.8.14 → 1.8.15

package/src/utils/getUrlParams.ts

@@ -0,0 +1,5 @@
+export default function getUrlParams() {
+  const urlSearchParams = new URLSearchParams(window.location.search)
+  const params = Object.fromEntries(urlSearchParams.entries())
+  return params
+}

package/src/utils/index.ts

@@ -0,0 +1,7 @@
+export { default as getUrlParams } from './getUrlParams'
+export { default as arrayPadEnd } from './arrayPadEnd'
+export { default as romanize } from './romanize'
+
+export { default as withRouteWrapper } from './withRouteWrapper'
+export { default as withSuspense } from './withSuspense'
+export { default as onLogout } from './logout'

package/src/utils/logout.ts

@@ -0,0 +1,25 @@
+import Cookies from 'js-cookie'
+import axios, { axiosErrorToast } from '../config/axios'
+
+export default function logout() {
+  axios({
+    method: 'POST',
+    baseURL: process.env.REACT_APP_API_HOST,
+    url: '/auth-server/auth/logout',
+  })
+    .then((res) => {
+      if (
+        process.env.NODE_ENV === 'development' ||
+        window.location.origin.split('campx')[1] === '.dev'
+      ) {
+        Cookies.remove('campx_tenant')
+        Cookies.remove('campx_session_key')
+        window.location.href = window.location.origin
+      } else {
+        window.location.href = 'https://id.campx.in'
+      }
+    })
+    .catch((err) => {
+      axiosErrorToast('Unable To Logout.')
+    })
+}

package/src/utils/ordinalSuffixOf.ts

@@ -0,0 +1,14 @@
+export default function ordinalSuffixOf(i: number) {
+  var j = i % 10,
+    k = i % 100
+  if (j == 1 && k != 11) {
+    return i + 'st'
+  }
+  if (j == 2 && k != 12) {
+    return i + 'nd'
+  }
+  if (j == 3 && k != 13) {
+    return i + 'rd'
+  }
+  return i + 'th'
+}

package/src/utils/romanize.ts

@@ -0,0 +1,40 @@
+export default function romanize(num) {
+  if (!+num) return false
+  var digits = String(+num).split(''),
+    key = [
+      '',
+      'C',
+      'CC',
+      'CCC',
+      'CD',
+      'D',
+      'DC',
+      'DCC',
+      'DCCC',
+      'CM',
+      '',
+      'X',
+      'XX',
+      'XXX',
+      'XL',
+      'L',
+      'LX',
+      'LXX',
+      'LXXX',
+      'XC',
+      '',
+      'I',
+      'II',
+      'III',
+      'IV',
+      'V',
+      'VI',
+      'VII',
+      'VIII',
+      'IX',
+    ],
+    roman = '',
+    i = 3
+  while (i--) roman = (key[+digits.pop() + i * 10] || '') + roman
+  return Array(+digits.join('') + 1).join('M') + roman
+}

package/src/utils/withRouteWrapper.tsx

@@ -0,0 +1,25 @@
+import { Suspense } from 'react'
+import PageWithPermission from '../permissions/PageWithPermission'
+import { Spinner } from '../components'
+
+const withRouteWrapper = (routes) => {
+  return routes?.map((item, index) => {
+    if (item?.children) {
+      return {
+        ...item,
+        children: withRouteWrapper(item.children),
+      }
+    }
+    return {
+      ...item,
+      element: item?.element ? (
+        <Suspense fallback={<Spinner />} key={index}>
+          <PageWithPermission permissionKey={item?.permissionKey}>
+            {item.element}
+          </PageWithPermission>
+        </Suspense>
+      ) : undefined,
+    }
+  })
+}
+export default withRouteWrapper

package/src/utils/withSuspense.tsx

@@ -0,0 +1,6 @@
+import { LinearProgress, Spinner } from '../components'
+import { ReactNode, Suspense } from 'react'
+
+export default function withSuspense(component: ReactNode) {
+  return <Suspense fallback={<LinearProgress />}>{component}</Suspense>
+}

package/styled-components.tsx

@@ -0,0 +1,60 @@
+import styled from 'styled-components'
+import { styled as muiStyled } from '@mui/material'
+
+export const headerHeight = '64px'
+export const sideNavWidth = '220px'
+
+export const StyledLayoutContainer = styled.div`
+  & > div {
+  }
+`
+
+export const StyledHeaderContainer = styled.header`
+  z-index: 300;
+  width: 100%;
+  position: fixed;
+  top: 0;
+  left: 0;
+  min-height: ${headerHeight};
+  background: #fff;
+  & > div {
+    height: ${headerHeight};
+  }
+`
+
+export const StyledLeftNavContainer = muiStyled('aside')(({ theme }) => ({
+  width: sideNavWidth,
+  background: theme.palette.secondary.main,
+  color: 'white',
+  position: 'fixed',
+  top: headerHeight,
+  left: 0,
+  height: `calc(100vh - ${headerHeight})`,
+  overflowY: 'auto',
+
+  '&::-webkit-scrollbar': {
+    width: '0.5em',
+    height: '0.5em',
+  },
+
+  '&::-webkit-scrollbar-thumb': {
+    backgroundColor: 'rgba(255, 255, 255, 0.3)',
+    borderRadius: '3px',
+
+    '&:hover': {
+      background: 'rgba(255, 255, 255, 0.4)',
+    },
+  },
+
+  zIndex: 100,
+}))
+
+export const StyledMainContentContainer = muiStyled('main')(() => ({
+  width: `calc(100% - ${sideNavWidth})`,
+  // width: '100%',
+  height: `calc(100vh - ${headerHeight})`,
+  position: 'fixed',
+  top: headerHeight,
+  left: sideNavWidth,
+  overflowY: 'auto',
+}))

package/tsconfig.json

@@ -0,0 +1,21 @@
+{
+	"compilerOptions": {
+		"target": "ES5",
+		"lib": ["dom", "dom.iterable", "esnext"],
+		"allowJs": true,
+		"skipLibCheck": true,
+		"esModuleInterop": true,
+		"allowSyntheticDefaultImports": true,
+		"strict": false,
+		"forceConsistentCasingInFileNames": true,
+		"noFallthroughCasesInSwitch": true,
+		"module": "ESNext",
+		"moduleResolution": "node",
+		"resolveJsonModule": true,
+		"isolatedModules": true,
+		"noEmit": true,
+		"jsx": "react-jsx",
+		"types": ["node"]
+	},
+	"include": ["src"]
+}