theme.palette.origin.main,
25 | backgroundColor: (theme) => theme.palette.background.paper,
26 | p: '5px',
27 | background: (theme) =>
28 | `linear-gradient(${theme.palette.background.paper}, ${theme.palette.background.paper}) padding-box, linear-gradient(180deg, #a951f4, #FF5082) border-box`,
29 | border: '4px solid transparent',
30 | ...outersx
31 | }}
32 | >
33 | {isImage ? (
34 | {
40 | e.target.src = '/static/circle-loading.svg';
41 | }}
42 | />
43 | ) : (
44 |
45 | )}
46 |
47 | );
48 | }
49 |
--------------------------------------------------------------------------------
/src/components/SearchNotFound.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { Paper, Typography } from '@mui/material';
3 |
4 | // ----------------------------------------------------------------------
5 |
6 | SearchNotFound.propTypes = {
7 | searchQuery: PropTypes.string
8 | };
9 |
10 | export default function SearchNotFound({ searchQuery = '', ...other }) {
11 | return (
12 |
13 |
14 | Not found
15 |
16 |
17 | No results found for
18 | "{searchQuery}". Try checking for typos or using complete words.
19 |
20 |
21 | );
22 | }
23 |
--------------------------------------------------------------------------------
/src/components/SnackbarCustom.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import PropTypes from 'prop-types';
3 | import { Snackbar, Alert } from '@mui/material';
4 |
5 | SnackbarCustom.propTypes = {
6 | vertical: PropTypes.string,
7 | horizontal: PropTypes.string,
8 | children: PropTypes.node,
9 | isOpen: PropTypes.bool,
10 | setOpen: PropTypes.func
11 | };
12 |
13 | export default function SnackbarCustom(props) {
14 | const { vertical = 'top', horizontal = 'center', children, isOpen, setOpen } = props;
15 |
16 | const handleClose = () => {
17 | setOpen(false);
18 | };
19 |
20 | return (
21 |
22 |
23 | {children}
24 |
25 |
26 | );
27 | }
28 |
--------------------------------------------------------------------------------
/src/components/TabPanel.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { Box } from '@mui/material';
3 |
4 | function TabPanel(props) {
5 | const { children, value, index, ...other } = props;
6 |
7 | return (
8 |
15 | {value === index && {children}}
16 |
17 | );
18 | }
19 |
20 | TabPanel.propTypes = {
21 | children: PropTypes.node,
22 | index: PropTypes.number.isRequired,
23 | value: PropTypes.number.isRequired
24 | };
25 |
26 | export default TabPanel;
27 |
--------------------------------------------------------------------------------
/src/components/ThemeLocalization.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | // material
3 | import { ThemeProvider, createTheme, useTheme } from '@mui/material/styles';
4 | // hooks
5 | import useLocales from '../hooks/useLocales';
6 |
7 | // ----------------------------------------------------------------------
8 |
9 | ThemeLocalization.propTypes = {
10 | children: PropTypes.node
11 | };
12 |
13 | export default function ThemeLocalization({ children }) {
14 | const defaultTheme = useTheme();
15 | const { currentLang } = useLocales();
16 |
17 | const theme = createTheme(defaultTheme, currentLang.systemValue);
18 |
19 | return {children};
20 | }
21 |
--------------------------------------------------------------------------------
/src/components/ThemePrimaryColor.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { useMemo } from 'react';
3 | // material
4 | import { alpha, ThemeProvider, createTheme, useTheme } from '@mui/material/styles';
5 | // hooks
6 | import useSettings from '../hooks/useSettings';
7 | //
8 | import componentsOverride from '../theme/overrides';
9 |
10 | // ----------------------------------------------------------------------
11 |
12 | ThemePrimaryColor.propTypes = {
13 | children: PropTypes.node
14 | };
15 |
16 | export default function ThemePrimaryColor({ children }) {
17 | const defaultTheme = useTheme();
18 | const { setColor } = useSettings();
19 |
20 | const themeOptions = useMemo(
21 | () => ({
22 | ...defaultTheme,
23 | palette: {
24 | ...defaultTheme.palette,
25 | primary: setColor
26 | },
27 | customShadows: {
28 | ...defaultTheme.customShadows,
29 | primary: `0 8px 16px 0 ${alpha(setColor.main, 0.24)}`
30 | }
31 | }),
32 | [setColor, defaultTheme]
33 | );
34 |
35 | const theme = createTheme(themeOptions);
36 | theme.components = componentsOverride(theme);
37 |
38 | return {children};
39 | }
40 |
--------------------------------------------------------------------------------
/src/components/TransLoadingButton.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { styled } from '@mui/material/styles';
3 | import { LoadingButton } from '@mui/lab';
4 |
5 | const LoadingButtonStyled = styled(LoadingButton)(({ theme }) => ({
6 | minWidth: 200,
7 | backgroundColor: theme.palette.mode === 'light' ? theme.palette.text.primary : theme.palette.grey[700],
8 | '&:hover':
9 | theme.palette.mode === 'dark'
10 | ? {
11 | backgroundColor: theme.palette.grey[600]
12 | }
13 | : {},
14 | '&.Mui-disabled': {
15 | paddingLeft: 40,
16 | color: theme.palette.origin.main,
17 | borderColor: theme.palette.origin.main,
18 | backgroundColor: 'unset'
19 | }
20 | }));
21 |
22 | export default function TransLoadingButton(props) {
23 | return (
24 | }
28 | variant={props.loading ? 'outlined' : 'contained'}
29 | fullWidth
30 | onClick={props.onClick}
31 | >
32 | {props.loading ? props.loadingText : props.children}
33 |
34 | );
35 | }
36 |
37 | TransLoadingButton.propTypes = {
38 | loading: PropTypes.bool,
39 | onClick: PropTypes.func,
40 | loadingText: PropTypes.string,
41 | children: PropTypes.node
42 | };
43 |
44 | TransLoadingButton.defaultProps = {
45 | loadingText: 'Please Sign Transaction From Wallet'
46 | };
47 |
--------------------------------------------------------------------------------
/src/components/animate/ButtonAnimate.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { motion } from 'framer-motion';
3 | // material
4 | import { Box } from '@mui/material';
5 | //
6 | import { varSmallClick, varMediumClick } from './variants';
7 |
8 | // ----------------------------------------------------------------------
9 |
10 | ButtonAnimate.propTypes = {
11 | mediumClick: PropTypes.bool,
12 | children: PropTypes.node,
13 | sx: PropTypes.object
14 | };
15 |
16 | export default function ButtonAnimate({ mediumClick = false, children, sx, ...other }) {
17 | return (
18 |
26 | {children}
27 |
28 | );
29 | }
30 |
--------------------------------------------------------------------------------
/src/components/animate/DialogAnimate.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { motion, AnimatePresence } from 'framer-motion';
3 | // material
4 | import { Dialog } from '@mui/material';
5 | //
6 | import { varFadeInUp } from './variants';
7 |
8 | // ----------------------------------------------------------------------
9 |
10 | DialogAnimate.propTypes = {
11 | open: PropTypes.bool.isRequired,
12 | animate: PropTypes.object,
13 | onClose: PropTypes.func,
14 | children: PropTypes.node.isRequired
15 | };
16 |
17 | export default function DialogAnimate({ open = false, animate, onClose, children, ...other }) {
18 | return (
19 |
20 | {open && (
21 |
38 | )}
39 |
40 | );
41 | }
42 |
--------------------------------------------------------------------------------
/src/components/animate/MotionContainer.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { motion } from 'framer-motion';
3 | // material
4 | import { Box } from '@mui/material';
5 | //
6 | import { varWrapEnter } from './variants';
7 |
8 | // ----------------------------------------------------------------------
9 |
10 | MotionContainer.propTypes = {
11 | open: PropTypes.bool.isRequired,
12 | children: PropTypes.node
13 | };
14 |
15 | export default function MotionContainer({ open, children, ...other }) {
16 | return (
17 |
18 | {children}
19 |
20 | );
21 | }
22 |
--------------------------------------------------------------------------------
/src/components/animate/MotionInView.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { useEffect } from 'react';
3 | import { motion, useAnimation } from 'framer-motion';
4 | import { useInView } from 'react-intersection-observer';
5 | // material
6 | import { Box } from '@mui/material';
7 |
8 | // ----------------------------------------------------------------------
9 |
10 | MotionInView.propTypes = {
11 | children: PropTypes.node,
12 | variants: PropTypes.object,
13 | transition: PropTypes.object,
14 | triggerOnce: PropTypes.bool,
15 | threshold: PropTypes.oneOfType([PropTypes.number, PropTypes.array])
16 | };
17 |
18 | export default function MotionInView({ children, variants, transition, threshold, ...other }) {
19 | const controls = useAnimation();
20 | const [ref, inView] = useInView({
21 | threshold: threshold || 0,
22 | triggerOnce: true
23 | });
24 |
25 | useEffect(() => {
26 | if (inView) {
27 | controls.start(Object.keys(variants)[1]);
28 | } else {
29 | controls.start(Object.keys(variants)[0]);
30 | }
31 | }, [controls, inView, variants]);
32 |
33 | return (
34 |
43 | {children}
44 |
45 | );
46 | }
47 |
--------------------------------------------------------------------------------
/src/components/animate/TextAnimate.js:
--------------------------------------------------------------------------------
1 | import { motion } from 'framer-motion';
2 | import PropTypes from 'prop-types';
3 | // material
4 | import { Typography } from '@mui/material';
5 | //
6 | import { varFadeInUp } from './variants';
7 |
8 | // ----------------------------------------------------------------------
9 |
10 | TextAnimate.propTypes = {
11 | text: PropTypes.string,
12 | variants: PropTypes.object,
13 | sx: PropTypes.object
14 | };
15 |
16 | export default function TextAnimate({ text, variants, sx, ...other }) {
17 | return (
18 |
28 | {text.split('').map((letter, index) => (
29 |
30 | {letter}
31 |
32 | ))}
33 |
34 | );
35 | }
36 |
--------------------------------------------------------------------------------
/src/components/animate/index.js:
--------------------------------------------------------------------------------
1 | export * from './variants';
2 | export { default as MotionInView } from './MotionInView';
3 | export { default as MotionContainer } from './MotionContainer';
4 | export { default as DialogAnimate } from './DialogAnimate';
5 | export { default as ButtonAnimate } from './ButtonAnimate';
6 | export { default as TextAnimate } from './TextAnimate';
7 |
--------------------------------------------------------------------------------
/src/components/animate/variants/Actions.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export const varHover = {
4 | hover: { scale: 1.1 }
5 | };
6 |
7 | export const varSmallClick = {
8 | hover: { scale: 1.04 },
9 | tap: { scale: 0.96 }
10 | };
11 |
12 | export const varMediumClick = {
13 | hover: { scale: 1.1 },
14 | tap: { scale: 0.9 }
15 | };
16 |
--------------------------------------------------------------------------------
/src/components/animate/variants/Path.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export const TRANSITION = {
4 | duration: 2,
5 | ease: [0.43, 0.13, 0.23, 0.96]
6 | };
7 |
8 | export const varPath = {
9 | animate: {
10 | fillOpacity: [0, 0, 1],
11 | pathLength: [1, 0.4, 0],
12 | transition: TRANSITION
13 | }
14 | };
15 |
--------------------------------------------------------------------------------
/src/components/animate/variants/Wrap.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export const varWrapEnter = {
4 | animate: {
5 | transition: { staggerChildren: 0.1 }
6 | }
7 | };
8 |
9 | export const varWrapExit = {
10 | exit: {
11 | transition: { staggerChildren: 0.1 }
12 | }
13 | };
14 |
15 | export const varWrapBoth = {
16 | animate: {
17 | transition: { staggerChildren: 0.07, delayChildren: 0.1 }
18 | },
19 | exit: {
20 | transition: { staggerChildren: 0.05, staggerDirection: -1 }
21 | }
22 | };
23 |
--------------------------------------------------------------------------------
/src/components/animate/variants/background/BackgroundColor.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const TRANSITION = {
4 | duration: 5,
5 | ease: 'linear'
6 | };
7 |
8 | export const varColor2x = {
9 | animate: {
10 | background: ['#19dcea', '#b22cff'],
11 | transition: TRANSITION
12 | }
13 | };
14 |
15 | export const varColor3x = {
16 | animate: {
17 | background: ['#19dcea', '#b22cff', '#ea2222'],
18 | transition: TRANSITION
19 | }
20 | };
21 |
22 | export const varColor4x = {
23 | animate: {
24 | background: ['#19dcea', '#b22cff', '#ea2222', '#f5be10'],
25 | transition: TRANSITION
26 | }
27 | };
28 |
29 | export const varColor5x = {
30 | animate: {
31 | background: ['#19dcea', '#b22cff', '#ea2222', '#f5be10', '#3bd80d'],
32 | transition: TRANSITION
33 | }
34 | };
35 |
--------------------------------------------------------------------------------
/src/components/animate/variants/background/BackgroundKenburns.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const TRANSITION = {
4 | duration: 5,
5 | ease: 'easeOut'
6 | };
7 |
8 | export const varKenburnsTop = {
9 | animate: {
10 | scale: [1, 1.25],
11 | y: [0, -15],
12 | transformOrigin: ['50% 16%', 'top'],
13 | transition: TRANSITION
14 | }
15 | };
16 |
17 | export const varKenburnsBottom = {
18 | animate: {
19 | scale: [1, 1.25],
20 | y: [0, 15],
21 | transformOrigin: ['50% 84%', 'bottom'],
22 | transition: TRANSITION
23 | }
24 | };
25 |
26 | export const varKenburnsLeft = {
27 | animate: {
28 | scale: [1, 1.25],
29 | x: [0, -20],
30 | y: [0, 15],
31 | transformOrigin: ['16% 50%', 'left'],
32 | transition: TRANSITION
33 | }
34 | };
35 |
36 | export const varKenburnsRight = {
37 | animate: {
38 | scale: [1, 1.25],
39 | x: [0, 20],
40 | y: [0, -15],
41 | transformOrigin: ['84% 50%', 'right'],
42 | transition: TRANSITION
43 | }
44 | };
45 |
--------------------------------------------------------------------------------
/src/components/animate/variants/background/BackgroundPan.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const TRANSITION = {
4 | duration: 4,
5 | ease: 'linear'
6 | };
7 |
8 | const gradient = (deg) => `linear-gradient(${deg}deg, #ee7752, #e73c7e, #23a6d5, #23d5ab)`;
9 |
10 | export const varPanTop = {
11 | animate: {
12 | backgroundImage: [gradient(0), gradient(0)],
13 | backgroundPosition: ['center 99%', 'center 1%'],
14 | backgroundSize: ['100% 600%', '100% 600%'],
15 | transition: TRANSITION
16 | }
17 | };
18 |
19 | export const varPanBottom = {
20 | animate: {
21 | backgroundImage: [gradient(0), gradient(0)],
22 | backgroundPosition: ['center 1%', 'center 99%'],
23 | backgroundSize: ['100% 600%', '100% 600%'],
24 | transition: TRANSITION
25 | }
26 | };
27 |
28 | export const varPanLeft = {
29 | animate: {
30 | backgroundPosition: ['99% center', '1% center'],
31 | backgroundImage: [gradient(270), gradient(270)],
32 | backgroundSize: ['600% 100%', '600% 100%'],
33 | transition: TRANSITION
34 | }
35 | };
36 |
37 | export const varPanRight = {
38 | animate: {
39 | backgroundPosition: ['1% center', '99% center'],
40 | backgroundImage: [gradient(270), gradient(270)],
41 | backgroundSize: ['600% 100%', '600% 100%'],
42 | transition: TRANSITION
43 | }
44 | };
45 |
--------------------------------------------------------------------------------
/src/components/animate/variants/background/index.js:
--------------------------------------------------------------------------------
1 | export * from './BackgroundKenburns';
2 | export * from './BackgroundPan';
3 | export * from './BackgroundColor';
4 |
--------------------------------------------------------------------------------
/src/components/animate/variants/bounce/BounceOut.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export const varBounceOut = {
4 | animate: {
5 | scale: [0.9, 1.1, 0.3],
6 | opacity: [1, 1, 0]
7 | }
8 | };
9 |
10 | export const varBounceOutUp = {
11 | animate: {
12 | y: [-12, 24, -720],
13 | scaleY: [0.985, 0.9, 3],
14 | opacity: [1, 1, 0]
15 | }
16 | };
17 |
18 | export const varBounceOutDown = {
19 | animate: {
20 | y: [12, -24, 720],
21 | scaleY: [0.985, 0.9, 3],
22 | opacity: [1, 1, 0]
23 | }
24 | };
25 |
26 | export const varBounceOutLeft = {
27 | animate: {
28 | x: [0, 24, -720],
29 | scaleX: [1, 0.9, 2],
30 | opacity: [1, 1, 0]
31 | }
32 | };
33 |
34 | export const varBounceOutRight = {
35 | animate: {
36 | x: [0, -24, 720],
37 | scaleX: [1, 0.9, 2],
38 | opacity: [1, 1, 0]
39 | }
40 | };
41 |
--------------------------------------------------------------------------------
/src/components/animate/variants/bounce/index.js:
--------------------------------------------------------------------------------
1 | export * from './BounceIn';
2 | export * from './BounceOut';
3 |
--------------------------------------------------------------------------------
/src/components/animate/variants/fade/FadeIn.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const DISTANCE = 120;
4 |
5 | const TRANSITION_ENTER = {
6 | duration: 0.64,
7 | ease: [0.43, 0.13, 0.23, 0.96]
8 | };
9 | const TRANSITION_EXIT = {
10 | duration: 0.48,
11 | ease: [0.43, 0.13, 0.23, 0.96]
12 | };
13 |
14 | export const varFadeIn = {
15 | initial: { opacity: 0 },
16 | animate: { opacity: 1, transition: TRANSITION_ENTER },
17 | exit: { opacity: 0, transition: TRANSITION_EXIT }
18 | };
19 |
20 | export const varFadeInUp = {
21 | initial: { y: DISTANCE, opacity: 0 },
22 | animate: { y: 0, opacity: 1, transition: TRANSITION_ENTER },
23 | exit: { y: DISTANCE, opacity: 0, transition: TRANSITION_EXIT }
24 | };
25 |
26 | export const varFadeInLeft = {
27 | initial: { x: -DISTANCE, opacity: 0 },
28 | animate: { x: 0, opacity: 1, transition: TRANSITION_ENTER },
29 | exit: { x: -DISTANCE, opacity: 0, transition: TRANSITION_EXIT }
30 | };
31 |
32 | export const varFadeInDown = {
33 | initial: { y: -DISTANCE, opacity: 0 },
34 | animate: { y: 0, opacity: 1, transition: TRANSITION_ENTER },
35 | exit: { y: -DISTANCE, opacity: 0, transition: TRANSITION_EXIT }
36 | };
37 |
38 | export const varFadeInRight = {
39 | initial: { x: DISTANCE, opacity: 0 },
40 | animate: { x: 0, opacity: 1, transition: TRANSITION_ENTER },
41 | exit: { x: DISTANCE, opacity: 0, transition: TRANSITION_EXIT }
42 | };
43 |
--------------------------------------------------------------------------------
/src/components/animate/variants/fade/FadeOut.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const DISTANCE = 120;
4 |
5 | const TRANSITION_ENTER = {
6 | duration: 0.64,
7 | ease: [0.43, 0.13, 0.23, 0.96]
8 | };
9 | const TRANSITION_EXIT = {
10 | duration: 0.48,
11 | ease: [0.43, 0.13, 0.23, 0.96]
12 | };
13 |
14 | export const varFadeOut = {
15 | initial: { opacity: 1 },
16 | animate: { opacity: 0, transition: TRANSITION_ENTER },
17 | exit: { opacity: 1, transition: TRANSITION_EXIT }
18 | };
19 |
20 | export const varFadeOutUp = {
21 | initial: { y: 0, opacity: 1 },
22 | animate: { y: -DISTANCE, opacity: 0, transition: TRANSITION_ENTER },
23 | exit: { y: 0, opacity: 1, transition: TRANSITION_EXIT }
24 | };
25 |
26 | export const varFadeOutDown = {
27 | initial: { y: 0, opacity: 1 },
28 | animate: { y: DISTANCE, opacity: 0, transition: TRANSITION_ENTER },
29 | exit: { y: 0, opacity: 1, transition: TRANSITION_EXIT }
30 | };
31 |
32 | export const varFadeOutLeft = {
33 | initial: { x: 0, opacity: 1 },
34 | animate: { x: -DISTANCE, opacity: 0, transition: TRANSITION_ENTER },
35 | exit: { x: 0, opacity: 1, transition: TRANSITION_EXIT }
36 | };
37 |
38 | export const varFadeOutRight = {
39 | initial: { x: 0, opacity: 1 },
40 | animate: { x: DISTANCE, opacity: 0, transition: TRANSITION_ENTER },
41 | exit: { x: 0, opacity: 1, transition: TRANSITION_EXIT }
42 | };
43 |
--------------------------------------------------------------------------------
/src/components/animate/variants/fade/index.js:
--------------------------------------------------------------------------------
1 | export * from './FadeIn';
2 | export * from './FadeOut';
3 |
--------------------------------------------------------------------------------
/src/components/animate/variants/flip/FlipIn.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const TRANSITION_ENTER = {
4 | duration: 0.64,
5 | ease: [0.43, 0.13, 0.23, 0.96]
6 | };
7 | const TRANSITION_EXIT = {
8 | duration: 0.48,
9 | ease: [0.43, 0.13, 0.23, 0.96]
10 | };
11 |
12 | export const varFlipInX = {
13 | initial: { rotateX: -180, opacity: 0 },
14 | animate: { rotateX: 0, opacity: 1, transition: TRANSITION_ENTER },
15 | exit: { rotateX: -180, opacity: 0, transition: TRANSITION_EXIT }
16 | };
17 |
18 | export const varFlipInY = {
19 | initial: { rotateY: -180, opacity: 0 },
20 | animate: { rotateY: 0, opacity: 1, transition: TRANSITION_ENTER },
21 | exit: { rotateY: -180, opacity: 0, transition: TRANSITION_EXIT }
22 | };
23 |
--------------------------------------------------------------------------------
/src/components/animate/variants/flip/FlipOut.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const TRANSITION_EXIT = {
4 | duration: 0.48,
5 | ease: [0.43, 0.13, 0.23, 0.96]
6 | };
7 |
8 | export const varFlipOutX = {
9 | initial: { rotateX: 0, opacity: 1 },
10 | animate: { rotateX: 70, opacity: 0, transition: TRANSITION_EXIT }
11 | };
12 |
13 | export const varFlipOutY = {
14 | initial: { rotateY: 0, opacity: 1 },
15 | animate: { rotateY: 70, opacity: 0, transition: TRANSITION_EXIT }
16 | };
17 |
--------------------------------------------------------------------------------
/src/components/animate/variants/flip/index.js:
--------------------------------------------------------------------------------
1 | export * from './FlipIn';
2 | export * from './FlipOut';
3 |
--------------------------------------------------------------------------------
/src/components/animate/variants/index.js:
--------------------------------------------------------------------------------
1 | export * from './Wrap';
2 | export * from './Path';
3 | export * from './Actions';
4 | export * from './background';
5 | export * from './slide';
6 | export * from './fade';
7 | export * from './zoom';
8 | export * from './bounce';
9 | export * from './flip';
10 | export * from './scale';
11 | export * from './rotate';
12 |
--------------------------------------------------------------------------------
/src/components/animate/variants/rotate/RotateIn.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const TRANSITION_ENTER = {
4 | duration: 0.64,
5 | ease: [0.43, 0.13, 0.23, 0.96]
6 | };
7 | const TRANSITION_EXIT = {
8 | duration: 0.48,
9 | ease: [0.43, 0.13, 0.23, 0.96]
10 | };
11 |
12 | export const varRotateIn = {
13 | initial: { opacity: 0, rotate: -360 },
14 | animate: { opacity: 1, rotate: 0, transition: TRANSITION_ENTER },
15 | exit: { opacity: 0, rotate: -360, transition: TRANSITION_EXIT }
16 | };
17 |
--------------------------------------------------------------------------------
/src/components/animate/variants/rotate/RotateOut.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const TRANSITION_EXIT = {
4 | duration: 0.48,
5 | ease: [0.43, 0.13, 0.23, 0.96]
6 | };
7 |
8 | export const varRotateOut = {
9 | initial: { opacity: 1, rotate: 0 },
10 | animate: { opacity: 0, rotate: -360, transition: TRANSITION_EXIT }
11 | };
12 |
--------------------------------------------------------------------------------
/src/components/animate/variants/rotate/index.js:
--------------------------------------------------------------------------------
1 | export * from './RotateIn';
2 | export * from './RotateOut';
3 |
--------------------------------------------------------------------------------
/src/components/animate/variants/scale/ScaleIn.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const TRANSITION_ENTER = {
4 | duration: 0.64,
5 | ease: [0.43, 0.13, 0.23, 0.96]
6 | };
7 | const TRANSITION_EXIT = {
8 | duration: 0.48,
9 | ease: [0.43, 0.13, 0.23, 0.96]
10 | };
11 |
12 | export const varScaleInX = {
13 | initial: { scaleX: 0, opacity: 0 },
14 | animate: { scaleX: 1, opacity: 1, transition: TRANSITION_ENTER },
15 | exit: { scaleX: 0, opacity: 0, transition: TRANSITION_EXIT }
16 | };
17 |
18 | export const varScaleInY = {
19 | initial: { scaleY: 0, opacity: 0 },
20 | animate: { scaleY: 1, opacity: 1, transition: TRANSITION_ENTER },
21 | exit: { scaleY: 0, opacity: 0, transition: TRANSITION_EXIT }
22 | };
23 |
--------------------------------------------------------------------------------
/src/components/animate/variants/scale/ScaleOut.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const TRANSITION_ENTER = {
4 | duration: 0.64,
5 | ease: [0.43, 0.13, 0.23, 0.96]
6 | };
7 |
8 | export const varScaleOutX = {
9 | initial: { scaleX: 1, opacity: 1 },
10 | animate: { scaleX: 0, opacity: 0, transition: TRANSITION_ENTER }
11 | };
12 |
13 | export const varScaleOutY = {
14 | initial: { scaleY: 1, opacity: 1 },
15 | animate: { scaleY: 0, opacity: 0, transition: TRANSITION_ENTER }
16 | };
17 |
--------------------------------------------------------------------------------
/src/components/animate/variants/scale/index.js:
--------------------------------------------------------------------------------
1 | export * from './ScaleIn';
2 | export * from './ScaleOut';
3 |
--------------------------------------------------------------------------------
/src/components/animate/variants/slide/SlideIn.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const DISTANCE = 160;
4 |
5 | const TRANSITION_ENTER = {
6 | duration: 0.64,
7 | ease: [0.43, 0.13, 0.23, 0.96]
8 | };
9 | const TRANSITION_EXIT = {
10 | duration: 0.48,
11 | ease: [0.43, 0.13, 0.23, 0.96]
12 | };
13 |
14 | export const varSlideInUp = {
15 | initial: { y: DISTANCE },
16 | animate: { y: 0, transition: TRANSITION_ENTER },
17 | exit: { y: DISTANCE, transition: TRANSITION_EXIT }
18 | };
19 |
20 | export const varSlideInDown = {
21 | initial: { y: -DISTANCE },
22 | animate: { y: 0, transition: TRANSITION_ENTER },
23 | exit: { y: -DISTANCE, transition: TRANSITION_EXIT }
24 | };
25 |
26 | export const varSlideInLeft = {
27 | initial: { x: -DISTANCE },
28 | animate: { x: 0, transition: TRANSITION_ENTER },
29 | exit: { x: -DISTANCE, transition: TRANSITION_EXIT }
30 | };
31 |
32 | export const varSlideInRight = {
33 | initial: { x: DISTANCE },
34 | animate: { x: 0, transition: TRANSITION_ENTER },
35 | exit: { x: DISTANCE, transition: TRANSITION_EXIT }
36 | };
37 |
--------------------------------------------------------------------------------
/src/components/animate/variants/slide/SlideOut.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const DISTANCE = 160;
4 |
5 | const TRANSITION_ENTER = {
6 | duration: 0.64,
7 | ease: [0.43, 0.13, 0.23, 0.96]
8 | };
9 |
10 | const TRANSITION_EXIT = {
11 | duration: 0.48,
12 | ease: [0.43, 0.13, 0.23, 0.96]
13 | };
14 |
15 | export const varSlideOutUp = {
16 | initial: { y: 0 },
17 | animate: { y: -DISTANCE, transition: TRANSITION_ENTER },
18 | exit: { y: 0, transition: TRANSITION_EXIT }
19 | };
20 |
21 | export const varSlideOutDown = {
22 | initial: { y: 0 },
23 | animate: { y: DISTANCE, transition: TRANSITION_ENTER },
24 | exit: { y: 0, transition: TRANSITION_EXIT }
25 | };
26 |
27 | export const varSlideOutLeft = {
28 | initial: { x: 0 },
29 | animate: { x: -DISTANCE, transition: TRANSITION_ENTER },
30 | exit: { x: 0, transition: TRANSITION_EXIT }
31 | };
32 |
33 | export const varSlideOutRight = {
34 | initial: { x: 0 },
35 | animate: { x: DISTANCE, transition: TRANSITION_ENTER },
36 | exit: { x: 0, transition: TRANSITION_EXIT }
37 | };
38 |
--------------------------------------------------------------------------------
/src/components/animate/variants/slide/index.js:
--------------------------------------------------------------------------------
1 | export * from './SlideIn';
2 | export * from './SlideOut';
3 |
--------------------------------------------------------------------------------
/src/components/animate/variants/zoom/In.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const DISTANCE = 720;
4 | const IN = { scale: 1, opacity: 1 };
5 | const OUT = { scale: 0, opacity: 0 };
6 |
7 | const TRANSITION_ENTER = {
8 | duration: 0.64,
9 | ease: [0.43, 0.13, 0.23, 0.96]
10 | };
11 |
12 | const TRANSITION_EXIT = {
13 | duration: 0.48,
14 | ease: [0.43, 0.13, 0.23, 0.96]
15 | };
16 |
17 | export const varZoomIn = {
18 | initial: OUT,
19 | animate: { ...IN, transition: TRANSITION_ENTER },
20 | exit: { ...OUT, transition: TRANSITION_EXIT }
21 | };
22 |
23 | export const varZoomInUp = {
24 | initial: { ...OUT, translateY: DISTANCE },
25 | animate: { ...IN, translateY: 0, transition: TRANSITION_ENTER },
26 | exit: { ...OUT, translateY: DISTANCE, transition: TRANSITION_EXIT }
27 | };
28 |
29 | export const varZoomInDown = {
30 | initial: { ...OUT, translateY: -DISTANCE },
31 | animate: { ...IN, translateY: 0, transition: TRANSITION_ENTER },
32 | exit: { ...OUT, translateY: -DISTANCE, transition: TRANSITION_EXIT }
33 | };
34 |
35 | export const varZoomInLeft = {
36 | initial: { ...OUT, translateX: -DISTANCE },
37 | animate: { ...IN, translateX: 0, transition: TRANSITION_ENTER },
38 | exit: { ...OUT, translateX: -DISTANCE, transition: TRANSITION_EXIT }
39 | };
40 |
41 | export const varZoomInRight = {
42 | initial: { ...OUT, translateX: DISTANCE },
43 | animate: { ...IN, translateX: 0, transition: TRANSITION_ENTER },
44 | exit: { ...OUT, translateX: DISTANCE, transition: TRANSITION_EXIT }
45 | };
46 |
--------------------------------------------------------------------------------
/src/components/animate/variants/zoom/Out.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const DISTANCE = 720;
4 | const IN = { scale: 1, opacity: 1 };
5 | const OUT = { scale: 0, opacity: 0 };
6 |
7 | const TRANSITION_ENTER = {
8 | duration: 0.64,
9 | ease: [0.43, 0.13, 0.23, 0.96]
10 | };
11 |
12 | export const varZoomOut = {
13 | initial: { scale: 1 },
14 | animate: { scale: 0, transition: TRANSITION_ENTER }
15 | };
16 |
17 | export const varZoomOutUp = {
18 | initial: IN,
19 | animate: { ...OUT, translateY: -DISTANCE, transition: TRANSITION_ENTER }
20 | };
21 |
22 | export const varZoomOutDown = {
23 | initial: IN,
24 | animate: { ...OUT, translateY: DISTANCE, transition: TRANSITION_ENTER }
25 | };
26 |
27 | export const varZoomOutLeft = {
28 | initial: IN,
29 | animate: { ...OUT, translateX: -DISTANCE, transition: TRANSITION_ENTER }
30 | };
31 |
32 | export const varZoomOutRight = {
33 | initial: IN,
34 | animate: { ...OUT, translateX: DISTANCE, transition: TRANSITION_ENTER }
35 | };
36 |
--------------------------------------------------------------------------------
/src/components/animate/variants/zoom/index.js:
--------------------------------------------------------------------------------
1 | export * from './In';
2 | export * from './Out';
3 |
--------------------------------------------------------------------------------
/src/components/carousel/controls/index.js:
--------------------------------------------------------------------------------
1 | export { default as CarouselControlsPaging2 } from './CarouselControlsPaging2';
--------------------------------------------------------------------------------
/src/components/carousel/index.js:
--------------------------------------------------------------------------------
1 | export * from './controls';
2 | export { default as CarouselCustom } from './CarouselCustom';
--------------------------------------------------------------------------------
/src/components/charts/index.js:
--------------------------------------------------------------------------------
1 | export { default as BaseOptionChart } from './BaseOptionChart';
2 | //
3 | export { default as ChartArea } from './ChartArea';
4 |
--------------------------------------------------------------------------------
/src/components/collection/VolumeIcon.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { Box } from '@mui/material';
3 |
4 | VolumeIcon.propTypes = {
5 | chainIndex: PropTypes.number
6 | };
7 |
8 | export default function VolumeIcon(props) {
9 | const { chainIndex } = props;
10 | const volumeIconTypes = [
11 | { icon: 'elastos.svg', style: { filter: (theme) => (theme.palette.mode === 'dark' ? 'invert(1)' : 'none') } },
12 | {
13 | icon: 'ethereum.svg',
14 | style: { filter: (theme) => (theme.palette.mode === 'light' ? 'invert(0.8)' : 'invert(0.2)'), width: 16 }
15 | },
16 | { icon: 'erc20/FSN.svg', style: { width: 16 } }
17 | ];
18 | let volumeIcon = null;
19 | if (chainIndex > 0) volumeIcon = volumeIconTypes[chainIndex - 1];
20 | else if (chainIndex === undefined) volumeIcon = null;
21 | else [volumeIcon] = volumeIconTypes;
22 |
23 | return volumeIcon ? (
24 |
29 | ) : null;
30 | }
31 |
--------------------------------------------------------------------------------
/src/components/custom-switch/index.js:
--------------------------------------------------------------------------------
1 | import { styled } from '@mui/material/styles';
2 | import { Switch } from '@mui/material';
3 |
4 | const CustomSwitch = styled(Switch)(({ theme }) => ({
5 | padding: 8,
6 | '& .Mui-checked+.MuiSwitch-track': {
7 | backgroundColor: `${theme.palette.text.primary} !important`
8 | },
9 | '& .MuiSwitch-track': {
10 | borderRadius: 22 / 2,
11 | '&:before, &:after': {
12 | content: '""',
13 | position: 'absolute',
14 | top: '50%',
15 | transform: 'translateY(-50%)',
16 | width: 16,
17 | height: 16
18 | },
19 | '&:before': {
20 | backgroundImage: `url('data:image/svg+xml;utf8,')`,
23 | left: 12
24 | },
25 | '&:after': {
26 | backgroundImage: `url('data:image/svg+xml;utf8,')`,
29 | right: 12
30 | }
31 | },
32 | '& .MuiSwitch-thumb': {
33 | boxShadow: 'none',
34 | width: 16,
35 | height: 16,
36 | margin: 2
37 | }
38 | }));
39 | export default CustomSwitch;
40 |
--------------------------------------------------------------------------------
/src/components/editor/draft/index.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { Editor } from 'react-draft-wysiwyg';
3 | //
4 | import { toolbarFull, toolbarSimple } from './DraftEditorToolbar';
5 | import DraftEditorStyle from './DraftEditorStyle';
6 |
7 | // ----------------------------------------------------------------------
8 |
9 | DraftEditor.propTypes = {
10 | simple: PropTypes.bool,
11 | error: PropTypes.bool,
12 | sx: PropTypes.object
13 | };
14 |
15 | export default function DraftEditor({ simple = false, error, sx, ...other }) {
16 | return (
17 | `solid 1px ${theme.palette.error.main}`
21 | }),
22 | ...sx
23 | }}
24 | >
25 |
26 |
27 | );
28 | }
29 |
--------------------------------------------------------------------------------
/src/components/editor/index.js:
--------------------------------------------------------------------------------
1 | export { default as QuillEditor } from './quill';
2 | export { default as DraftEditor } from './draft';
3 |
--------------------------------------------------------------------------------
/src/components/explorer/CollectionView/Template.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { Icon } from '@iconify/react';
3 | import { Link as RouterLink } from 'react-router-dom';
4 | import arrowIosForwardFill from '@iconify/icons-eva/arrow-ios-forward-fill';
5 | // material
6 | import { Box, Stack, Card, Button, Grid, CardHeader } from '@mui/material';
7 | import Scrollbar from '../../Scrollbar';
8 |
9 | // ----------------------------------------------------------------------
10 | export default function CollectionView(props) {
11 | return (
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 | }
25 | >
26 | See more
27 |
28 |
29 |
30 |
31 |
32 |
33 | {props.children}
34 |
35 |
36 |
37 | );
38 | }
39 |
40 | CollectionView.propTypes = {
41 | title: PropTypes.string,
42 | to: PropTypes.string,
43 | children: PropTypes.node
44 | };
45 |
--------------------------------------------------------------------------------
/src/components/explorer/StatisticPanel/index.js:
--------------------------------------------------------------------------------
1 | // material
2 | import { styled } from '@mui/material/styles';
3 | import { Grid, Card } from '@mui/material';
4 | import StatisticItem from './StatisticItem';
5 | // ----------------------------------------------------------------------
6 | const RootStyle = styled(Card)(({ theme }) => ({
7 | margin: 'auto',
8 | display: 'flex',
9 | position: 'relative',
10 | alignItems: 'center',
11 | flexDirection: 'column',
12 | padding: theme.spacing(4),
13 | [theme.breakpoints.down('sm')]: {
14 | padding: theme.spacing(3)
15 | }
16 | }));
17 |
18 | export default function StatisticPanel() {
19 | return (
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 | );
37 | }
38 |
--------------------------------------------------------------------------------
/src/components/home/TransSkeleton.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Skeleton, { SkeletonTheme } from 'react-loading-skeleton';
3 | import 'react-loading-skeleton/dist/skeleton.css';
4 | import { Box, Stack, Divider } from '@mui/material';
5 | import useSettings from '../../hooks/useSettings';
6 | // ----------------------------------------------------------------------
7 |
8 | export default function TransSkeleton() {
9 | const { themeMode } = useSettings();
10 | const themeProp = {};
11 | if (themeMode === 'dark') {
12 | themeProp.baseColor = '#333d48';
13 | themeProp.highlightColor = '#434d58';
14 | }
15 | return (
16 | <>
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 | );
35 | }
36 |
--------------------------------------------------------------------------------
/src/components/main-logo/index.js:
--------------------------------------------------------------------------------
1 | import { Link as RouterLink } from 'react-router-dom';
2 | import { motion } from 'framer-motion';
3 | // material
4 | import { useTheme, styled } from '@mui/material/styles';
5 | import { Box, Link, Container } from '@mui/material';
6 | // components
7 | import { varWrapEnter, varFadeIn } from '../animate';
8 |
9 | const RootStyle = styled('div')(({ theme }) => ({
10 | padding: theme.spacing(3, 0, 1)
11 | }));
12 |
13 | export default function MainLogo() {
14 | const theme = useTheme();
15 |
16 | return (
17 |
18 |
19 |
26 |
27 |
28 |
34 |
35 |
36 |
37 |
38 |
39 | );
40 | }
41 |
--------------------------------------------------------------------------------
/src/components/marketplace/AssetCardSkeleton.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Skeleton, { SkeletonTheme } from 'react-loading-skeleton';
3 | import 'react-loading-skeleton/dist/skeleton.css';
4 | import { Box, Stack } from '@mui/material';
5 |
6 | import PaperRecord from '../PaperRecord';
7 | import useSettings from '../../hooks/useSettings';
8 | // ----------------------------------------------------------------------
9 |
10 | export default function AssetCardSkeleton() {
11 | const { themeMode } = useSettings();
12 | const themeProp = {};
13 | if (themeMode === 'dark') {
14 | themeProp.baseColor = '#333d48';
15 | themeProp.highlightColor = '#434d58';
16 | }
17 | return (
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 | );
36 | }
37 |
--------------------------------------------------------------------------------
/src/components/marketplace/MultiMintGrid.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import PropTypes from 'prop-types';
3 | import { motion, AnimatePresence } from 'framer-motion';
4 | import { Box } from '@mui/material';
5 | import AssetCard from './AssetCard';
6 | // ----------------------------------------------------------------------
7 |
8 | const StackedGrid = ({ children }) => (
9 |
10 | {children}
11 |
12 | );
13 |
14 | StackedGrid.propTypes = {
15 | children: PropTypes.node
16 | };
17 |
18 | const GridItems = (props) => (
19 |
20 | {props.assets.map((src, index) => (
21 |
22 |
30 |
31 | ))}
32 |
33 | );
34 |
35 | GridItems.propTypes = {
36 | assets: PropTypes.any,
37 | multiNames: PropTypes.any
38 | };
39 |
40 | export default function MultiMintGrid(props) {
41 | return (
42 |
43 |
44 |
45 | );
46 | }
47 |
--------------------------------------------------------------------------------
/src/components/marketplace/StartingDateSelect.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Select from '@mui/material/Select';
3 | import MenuItem from '@mui/material/MenuItem';
4 | import PropTypes from 'prop-types';
5 |
6 | const MenuProps = {
7 | anchorOrigin: {
8 | vertical: 'bottom',
9 | horizontal: 'left'
10 | },
11 | transformOrigin: {
12 | vertical: 'top',
13 | horizontal: 'left'
14 | },
15 | variant: 'menu'
16 | };
17 | const menuItems = ['Right after listing'];
18 |
19 | export default function StartingDateSelect({ selected, onChange }) {
20 | const handleChange = (event) => {
21 | onChange(event.target.value);
22 | };
23 | return (
24 |
46 | );
47 | }
48 |
49 | StartingDateSelect.propTypes = {
50 | onChange: PropTypes.func,
51 | selected: PropTypes.number
52 | };
53 |
--------------------------------------------------------------------------------
/src/components/mega-menu/MenuHotProducts.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import { Link as RouterLink } from 'react-router-dom';
3 | // material
4 | import { Link, Typography, Box } from '@mui/material';
5 |
6 | // ----------------------------------------------------------------------
7 |
8 | MenuHotProducts.propTypes = {
9 | tags: PropTypes.array
10 | };
11 |
12 | export default function MenuHotProducts({ tags, ...other }) {
13 | return (
14 |
15 |
16 | Hot Products:
17 |
18 |
19 | {tags.map((tag, index) => (
20 | theme.transitions.create('all'),
29 | '&:hover': { color: 'primary.main' }
30 | }}
31 | >
32 | {index === 0 ? tag.name : `, ${tag.name} `}
33 |
34 | ))}
35 |
36 | );
37 | }
38 |
--------------------------------------------------------------------------------
/src/components/mega-menu/index.js:
--------------------------------------------------------------------------------
1 | export { default as MegaMenuDesktopVertical } from './MegaMenuDesktopVertical';
2 | export { default as MegaMenuDesktopHorizon } from './MegaMenuDesktopHorizon';
3 | export { default as MegaMenuMobile } from './MegaMenuMobile';
4 | export { default as MenuConfig } from './MenuConfig';
5 |
--------------------------------------------------------------------------------
/src/components/pagination/ShowSelect/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { styled } from '@mui/material/styles';
3 | import Select from '@mui/material/Select';
4 | import MenuItem from '@mui/material/MenuItem';
5 | import PropTypes from 'prop-types';
6 |
7 | const DivStyle = styled('div')(({ theme }) => ({
8 | flex: 1,
9 | marginTop: theme.spacing(1)
10 | }));
11 | export default function ShowSelect({ showCount, onChange }) {
12 | return (
13 |
14 | Show
15 |
28 | Records
29 |
30 | );
31 | }
32 |
33 | ShowSelect.propTypes = {
34 | showCount: PropTypes.number,
35 | onChange: PropTypes.func,
36 | };
37 |
--------------------------------------------------------------------------------
/src/components/settings/SettingFullscreen.js:
--------------------------------------------------------------------------------
1 | import { useState } from 'react';
2 | import { Icon } from '@iconify/react';
3 | import roundFullscreen from '@iconify/icons-ic/round-fullscreen';
4 | import roundFullscreenExit from '@iconify/icons-ic/round-fullscreen-exit';
5 | // material
6 | import { alpha } from '@mui/material/styles';
7 | import { Button } from '@mui/material';
8 |
9 | // ----------------------------------------------------------------------
10 |
11 | export default function SettingFullscreen() {
12 | const [fullscreen, setFullscreen] = useState(false);
13 |
14 | const toggleFullScreen = () => {
15 | if (!document.fullscreenElement) {
16 | document.documentElement.requestFullscreen();
17 | setFullscreen(true);
18 | } else if (document.exitFullscreen) {
19 | document.exitFullscreen();
20 | setFullscreen(false);
21 | }
22 | };
23 |
24 | return (
25 | }
31 | onClick={toggleFullScreen}
32 | sx={{
33 | fontSize: 14,
34 | ...(fullscreen && {
35 | bgcolor: (theme) => alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity)
36 | })
37 | }}
38 | >
39 | {fullscreen ? 'Exit Fullscreen' : 'Fullscreen'}
40 |
41 | );
42 | }
43 |
--------------------------------------------------------------------------------
/src/components/signin-dlg/connectors.js:
--------------------------------------------------------------------------------
1 | import { InjectedConnector } from "@web3-react/injected-connector";
2 | import { WalletConnectConnector } from "@web3-react/walletconnect-connector";
3 | import { WalletLinkConnector } from "@web3-react/walletlink-connector";
4 |
5 | const RPC_URL_1 =
6 | "https://mainnet.infura.io/v3/e2d4593179fa4120a217d136a0518efc";
7 | const RPC_URL_4 =
8 | "https://goerli.infura.io/v3/02505ed478e64ee481a74236dc9e91f1";
9 | const RPC_URL_20 =
10 | "https://api.elastos.io/eth";
11 | const RPC_URL_21 =
12 | "https://api-testnet.elastos.io/eth";
13 |
14 |
15 | const RPC_URLS = {
16 | 1: RPC_URL_1,
17 | 4: RPC_URL_4,
18 | 20: RPC_URL_20,
19 | 21: RPC_URL_21,
20 | };
21 |
22 | export const injected = new InjectedConnector({
23 | supportedChainIds: [1, 3, 4, 5, 20, 21, 42, 56, 97],
24 | });
25 |
26 | export const walletconnect = new WalletConnectConnector({
27 | rpc: { 1: RPC_URLS[1] },
28 | qrcode: true,
29 | // supportedChainIds: [1, 3, 4, 5, 20, 21, 42, 10, 137, 69, 420, 80001],
30 | });
31 |
32 | export const walletlink = new WalletLinkConnector({
33 | url: RPC_URLS[1],
34 | appName: "Global Income Coin",
35 | supportedChainIds: [1, 3, 4, 5, 20, 21, 42, 10, 137, 69, 420, 80001],
36 | });
37 |
38 | export const resetWalletConnector = (connector) => {
39 | if (
40 | connector &&
41 | connector instanceof WalletConnectConnector
42 | ) {
43 | connector.walletConnectProvider = undefined
44 | }
45 | }
46 |
--------------------------------------------------------------------------------
/src/components/upload/index.js:
--------------------------------------------------------------------------------
1 | export { default as UploadMultiFile } from './UploadMultiFile';
2 | export { default as UploadSingleFile } from './UploadSingleFile';
3 | export { default as UploadAvatar } from './UploadAvatar';
4 |
--------------------------------------------------------------------------------
/src/contexts/AuctionDlgContext.js:
--------------------------------------------------------------------------------
1 | import { createContext, useState } from 'react'
2 | import PropTypes from 'prop-types';
3 |
4 | // ----------------------------------------------------------------------
5 |
6 | const initialState = {
7 | updateCount: 0,
8 | setUpdateCount: () => {},
9 | };
10 |
11 | const AuctionDlgContext = createContext(initialState);
12 |
13 | AuctionDlgProvider.propTypes = {
14 | children: PropTypes.node
15 | };
16 |
17 | function AuctionDlgProvider({ children }) {
18 | const [updateCount, setUpdateCount] = useState(0);
19 |
20 | return (
21 |
27 | {children}
28 |
29 | );
30 | }
31 |
32 | export { AuctionDlgProvider, AuctionDlgContext };
33 |
--------------------------------------------------------------------------------
/src/hooks/useAuctionDlg.js:
--------------------------------------------------------------------------------
1 | import { useContext } from 'react';
2 | import { AuctionDlgContext } from '../contexts/AuctionDlgContext';
3 |
4 | // ----------------------------------------------------------------------
5 |
6 | const useAuctionDlg = () => useContext(AuctionDlgContext);
7 |
8 | export default useAuctionDlg;
--------------------------------------------------------------------------------
/src/hooks/useAuth.js:
--------------------------------------------------------------------------------
1 | import { useContext } from 'react';
2 | import { AuthContext } from '../contexts/JWTContext';
3 |
4 | // ----------------------------------------------------------------------
5 |
6 | const useAuth = () => useContext(AuthContext);
7 |
8 | export default useAuth;
9 |
--------------------------------------------------------------------------------
/src/hooks/useCollapseDrawer.js:
--------------------------------------------------------------------------------
1 | import { useContext } from 'react';
2 | import { CollapseDrawerContext } from '../contexts/CollapseDrawerContext';
3 |
4 | // ----------------------------------------------------------------------
5 |
6 | const useCollapseDrawer = () => useContext(CollapseDrawerContext);
7 |
8 | export default useCollapseDrawer;
9 |
--------------------------------------------------------------------------------
/src/hooks/useCountdown.js:
--------------------------------------------------------------------------------
1 | import { useState, useEffect } from 'react';
2 |
3 | // ----------------------------------------------------------------------
4 |
5 | export default function useCountdown(date) {
6 | const [countdown, setCountdown] = useState({
7 | days: '00',
8 | hours: '00',
9 | minutes: '00',
10 | seconds: '00'
11 | });
12 |
13 | useEffect(() => {
14 | const interval = setInterval(() => setNewTime(), 1000);
15 | return () => clearInterval(interval);
16 | // eslint-disable-next-line react-hooks/exhaustive-deps
17 | }, []);
18 |
19 | const setNewTime = () => {
20 | const startTime = date;
21 | const endTime = new Date();
22 | const distanceToNow = startTime - endTime;
23 |
24 | const getDays = Math.floor(distanceToNow / (1000 * 60 * 60 * 24));
25 | const getHours = `0${Math.floor((distanceToNow % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))}`.slice(-2);
26 | const getMinutes = `0${Math.floor((distanceToNow % (1000 * 60 * 60)) / (1000 * 60))}`.slice(-2);
27 | const getSeconds = `0${Math.floor((distanceToNow % (1000 * 60)) / 1000)}`.slice(-2);
28 |
29 | setCountdown({
30 | days: getDays || '000',
31 | hours: getHours || '000',
32 | minutes: getMinutes || '000',
33 | seconds: getSeconds || '000'
34 | });
35 | };
36 |
37 | return countdown;
38 | }
39 |
40 | // Usage
41 | // const countdown = useCountdown(new Date('07/07/2022 21:30'));
42 |
--------------------------------------------------------------------------------
/src/hooks/useIsMountedRef.js:
--------------------------------------------------------------------------------
1 | import { useRef, useEffect } from 'react';
2 |
3 | // ----------------------------------------------------------------------
4 |
5 | export default function useIsMountedRef() {
6 | const isMounted = useRef(true);
7 |
8 | useEffect(
9 | () => () => {
10 | isMounted.current = false;
11 | },
12 | []
13 | );
14 |
15 | return isMounted;
16 | }
17 |
--------------------------------------------------------------------------------
/src/hooks/useLocalStorage.js:
--------------------------------------------------------------------------------
1 | import { useState, useEffect } from 'react';
2 |
3 | // ----------------------------------------------------------------------
4 |
5 | export default function useLocalStorage(key, defaultValue) {
6 | const [value, setValue] = useState(() => {
7 | const storedValue = localStorage.getItem(key);
8 | return storedValue === null ? defaultValue : JSON.parse(storedValue);
9 | });
10 |
11 | useEffect(() => {
12 | const listener = (e) => {
13 | if (e.storageArea === localStorage && e.key === key) {
14 | setValue(JSON.parse(e.newValue));
15 | }
16 | };
17 | window.addEventListener('storage', listener);
18 |
19 | return () => {
20 | window.removeEventListener('storage', listener);
21 | };
22 | }, [key, defaultValue]);
23 |
24 | const setValueInLocalStorage = (newValue) => {
25 | setValue((currentValue) => {
26 | const result = typeof newValue === 'function' ? newValue(currentValue) : newValue;
27 | localStorage.setItem(key, JSON.stringify(result));
28 | return result;
29 | });
30 | };
31 |
32 | return [value, setValueInLocalStorage];
33 | }
34 |
--------------------------------------------------------------------------------
/src/hooks/useLocales.js:
--------------------------------------------------------------------------------
1 | import { useTranslation } from 'react-i18next';
2 | // material
3 | import { enUS, deDE, frFR } from '@mui/material/locale';
4 |
5 | // ----------------------------------------------------------------------
6 |
7 | const LANGS = [
8 | {
9 | label: 'English',
10 | value: 'en',
11 | systemValue: enUS,
12 | icon: '/static/icons/ic_flag_en.svg'
13 | },
14 | {
15 | label: 'German',
16 | value: 'de',
17 | systemValue: deDE,
18 |
19 | icon: '/static/icons/ic_flag_de.svg'
20 | },
21 | {
22 | label: 'French',
23 | value: 'fr',
24 | systemValue: frFR,
25 | icon: '/static/icons/ic_flag_fr.svg'
26 | }
27 | ];
28 |
29 | export default function useLocales() {
30 | const { i18n, t: translate } = useTranslation();
31 | const langStorage = localStorage.getItem('i18nextLng');
32 | const currentLang = LANGS.find((_lang) => _lang.value === langStorage) || LANGS[1];
33 |
34 | const handleChangeLanguage = (newlang) => {
35 | i18n.changeLanguage(newlang);
36 | };
37 |
38 | return {
39 | onChangeLang: handleChangeLanguage,
40 | translate,
41 | currentLang,
42 | allLang: LANGS
43 | };
44 | }
45 |
--------------------------------------------------------------------------------
/src/hooks/useMintDlg.js:
--------------------------------------------------------------------------------
1 | import { useContext } from 'react';
2 | import { MintDlgContext } from '../contexts/MintDlgContext';
3 |
4 | // ----------------------------------------------------------------------
5 |
6 | const useMintDlg = () => useContext(MintDlgContext);
7 |
8 | export default useMintDlg;
--------------------------------------------------------------------------------
/src/hooks/useOffSetTop.js:
--------------------------------------------------------------------------------
1 | import { useState, useEffect } from 'react';
2 |
3 | // ----------------------------------------------------------------------
4 |
5 | export default function useOffSetTop(top) {
6 | const [offsetTop, setOffSetTop] = useState(false);
7 | const isTop = top || 100;
8 |
9 | useEffect(() => {
10 | window.addEventListener('scroll', () => {
11 | if (window.pageYOffset > isTop) {
12 | setOffSetTop(true);
13 | } else {
14 | setOffSetTop(false);
15 | }
16 | }
17 | );
18 | }, [isTop]);
19 |
20 | return offsetTop;
21 | }
22 |
23 | // Usage
24 | // const offset = useOffSetTop(100);
25 |
--------------------------------------------------------------------------------
/src/hooks/useSettings.js:
--------------------------------------------------------------------------------
1 | import { useContext } from 'react';
2 | import { SettingsContext } from '../contexts/SettingsContext';
3 |
4 | // ----------------------------------------------------------------------
5 |
6 | const useSettings = () => useContext(SettingsContext);
7 |
8 | export default useSettings;
9 |
--------------------------------------------------------------------------------
/src/hooks/useSignin.js:
--------------------------------------------------------------------------------
1 | import { useContext } from 'react';
2 | import { SigninContext } from '../contexts/SigninContext';
3 |
4 | // ----------------------------------------------------------------------
5 |
6 | const useSignIn = () => useContext(SigninContext);
7 |
8 | export default useSignIn;
9 |
--------------------------------------------------------------------------------
/src/layouts/LogoOnlyLayout.js:
--------------------------------------------------------------------------------
1 | import { Outlet } from 'react-router-dom';
2 |
3 | export default function LogoOnlyLayout() {
4 | return ;
5 | }
6 |
--------------------------------------------------------------------------------
/src/layouts/main/MenuConfig.js:
--------------------------------------------------------------------------------
1 | import { Icon } from '@iconify/react';
2 | import roundGrain from '@iconify/icons-ic/round-grain';
3 | import bookOpenFill from '@iconify/icons-eva/book-open-fill';
4 | // routes
5 | import { PATH_PAGE } from '../../routes/paths';
6 |
7 | // ----------------------------------------------------------------------
8 |
9 | const ICON_SIZE = {
10 | width: 22,
11 | height: 22
12 | };
13 |
14 | const menuConfig = [
15 | {
16 | title: 'Explorer',
17 | icon: ,
18 | path: PATH_PAGE.explorer,
19 | disable: false
20 | },
21 | {
22 | title: 'Marketplace',
23 | icon: ,
24 | path: PATH_PAGE.marketplace,
25 | disable: false
26 | },
27 | {
28 | title: 'Collections',
29 | icon: ,
30 | path: PATH_PAGE.collection,
31 | disable: false
32 | },
33 | {
34 | title: 'Create',
35 | icon: ,
36 | path: PATH_PAGE.create,
37 | disable: false
38 | },
39 | {
40 | title: 'Activity',
41 | icon: ,
42 | path: PATH_PAGE.activity,
43 | disable: false
44 | },
45 | {
46 | title: 'Features',
47 | icon: ,
48 | path: PATH_PAGE.features,
49 | disable: false
50 | },
51 | {
52 | title: 'Rewards',
53 | icon: ,
54 | path: PATH_PAGE.rewards,
55 | disable: false
56 | }
57 | ];
58 |
59 | export default menuConfig;
60 |
--------------------------------------------------------------------------------
/src/pages/Page500.js:
--------------------------------------------------------------------------------
1 | import { Link as RouterLink } from 'react-router-dom';
2 | import { styled } from '@mui/material/styles';
3 | // material
4 | import { Box, Button, Typography, Container } from '@mui/material';
5 | // components
6 | import Page from '../components/Page';
7 | import { SeverErrorIllustration } from '../assets';
8 |
9 | // ----------------------------------------------------------------------
10 |
11 | const RootStyle = styled(Page)(({ theme }) => ({
12 | display: 'flex',
13 | minHeight: '100%',
14 | alignItems: 'center',
15 | paddingTop: theme.spacing(15),
16 | paddingBottom: theme.spacing(10)
17 | }));
18 |
19 | // ----------------------------------------------------------------------
20 |
21 | export default function Page500() {
22 | return (
23 |
24 |
25 |
26 |
27 | 500 Internal Server Error
28 |
29 | There was an error, please try again later.
30 |
31 |
32 |
33 |
36 |
37 |
38 |
39 | );
40 | }
41 |
--------------------------------------------------------------------------------
/src/redux/rootReducer.js:
--------------------------------------------------------------------------------
1 | import { combineReducers } from 'redux';
2 | import { persistReducer } from 'redux-persist';
3 | import storage from 'redux-persist/lib/storage';
4 | // slices
5 | import mailReducer from './slices/mail';
6 | import chatReducer from './slices/chat';
7 | import blogReducer from './slices/blog';
8 | import userReducer from './slices/user';
9 | import productReducer from './slices/product';
10 | import calendarReducer from './slices/calendar';
11 | import kanbanReducer from './slices/kanban';
12 |
13 | // ----------------------------------------------------------------------
14 |
15 | const rootPersistConfig = {
16 | key: 'root',
17 | storage,
18 | keyPrefix: 'redux-',
19 | whitelist: []
20 | };
21 |
22 | const productPersistConfig = {
23 | key: 'product',
24 | storage,
25 | keyPrefix: 'redux-',
26 | whitelist: ['sortBy', 'checkout']
27 | };
28 |
29 | const rootReducer = combineReducers({
30 | mail: mailReducer,
31 | chat: chatReducer,
32 | blog: blogReducer,
33 | user: userReducer,
34 | calendar: calendarReducer,
35 | kanban: kanbanReducer,
36 | product: persistReducer(productPersistConfig, productReducer)
37 | });
38 |
39 | export { rootPersistConfig, rootReducer };
40 |
--------------------------------------------------------------------------------
/src/redux/store.js:
--------------------------------------------------------------------------------
1 | import { useDispatch as useReduxDispatch, useSelector as useReduxSelector } from 'react-redux';
2 | import { configureStore, getDefaultMiddleware } from '@reduxjs/toolkit';
3 | import { persistStore, persistReducer } from 'redux-persist';
4 | //
5 | import { rootPersistConfig, rootReducer } from './rootReducer';
6 |
7 | // ----------------------------------------------------------------------
8 |
9 | const store = configureStore({
10 | reducer: persistReducer(rootPersistConfig, rootReducer),
11 | middleware: getDefaultMiddleware({
12 | serializableCheck: false,
13 | immutableCheck: false
14 | })
15 | });
16 |
17 | const persistor = persistStore(store);
18 |
19 | const useSelector = useReduxSelector;
20 |
21 | const useDispatch = () => useReduxDispatch();
22 |
23 | export { store, persistor, useSelector, useDispatch };
24 |
--------------------------------------------------------------------------------
/src/routes/paths.js:
--------------------------------------------------------------------------------
1 | export const PATH_PAGE = {
2 | explorer: '/explorer',
3 | marketplace: '/marketplace',
4 | create: '/create',
5 | collection: '/collections',
6 | activity: '/activity',
7 | features: '/features',
8 | rewards: '/rewards'
9 | };
10 |
11 | export const PATH_DOCS = 'https://docs.pasarprotocol.io';
12 |
--------------------------------------------------------------------------------
/src/theme/breakpoints.js:
--------------------------------------------------------------------------------
1 | const breakpoints = {
2 | values: {
3 | xs: 0,
4 | sm: 600,
5 | md: 900, // OLD 960
6 | lg: 1200, // OLD 1280
7 | xl: 1536 // OLD 1920
8 | }
9 | };
10 |
11 | export default breakpoints;
12 |
--------------------------------------------------------------------------------
/src/theme/overrides/Accordion.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Accordion(theme) {
4 | return {
5 | MuiAccordion: {
6 | styleOverrides: {
7 | root: {
8 | '&.Mui-expanded': {
9 | // boxShadow: theme.customShadows.z8,
10 | borderRadius: theme.shape.borderRadius
11 | },
12 | '&.Mui-disabled': {
13 | backgroundColor: 'transparent'
14 | }
15 | }
16 | }
17 | },
18 | MuiAccordionSummary: {
19 | styleOverrides: {
20 | root: {
21 | paddingLeft: theme.spacing(2),
22 | paddingRight: theme.spacing(1),
23 | '&.Mui-disabled': {
24 | opacity: 1,
25 | color: theme.palette.action.disabled,
26 | '& .MuiTypography-root': {
27 | color: 'inherit'
28 | }
29 | }
30 | },
31 | expandIconWrapper: {
32 | color: 'inherit'
33 | }
34 | }
35 | }
36 | };
37 | }
38 |
--------------------------------------------------------------------------------
/src/theme/overrides/Autocomplete.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Autocomplete(theme) {
4 | return {
5 | MuiAutocomplete: {
6 | styleOverrides: {
7 | paper: {
8 | boxShadow: theme.customShadows.z20
9 | }
10 | }
11 | }
12 | };
13 | }
14 |
--------------------------------------------------------------------------------
/src/theme/overrides/Avatar.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Avatar(theme) {
4 | return {
5 | MuiAvatar: {
6 | styleOverrides: {
7 | colorDefault: {
8 | color: theme.palette.text.secondary,
9 | backgroundColor: theme.palette.grey[400]
10 | }
11 | }
12 | },
13 | MuiAvatarGroup: {
14 | styleOverrides: {
15 | avatar: {
16 | fontSize: 16,
17 | fontWeight: theme.typography.fontWeightMedium,
18 | '&:first-of-type': {
19 | fontSize: 14,
20 | color: theme.palette.primary.main,
21 | backgroundColor: theme.palette.primary.lighter
22 | }
23 | }
24 | }
25 | }
26 | };
27 | }
28 |
--------------------------------------------------------------------------------
/src/theme/overrides/Backdrop.js:
--------------------------------------------------------------------------------
1 | import { alpha } from '@mui/material/styles';
2 |
3 | // ----------------------------------------------------------------------
4 |
5 | export default function Backdrop(theme) {
6 | const varLow = alpha(theme.palette.grey[900], 0.48);
7 | const varHigh = alpha(theme.palette.grey[900], 1);
8 |
9 | return {
10 | MuiBackdrop: {
11 | styleOverrides: {
12 | root: {
13 | background: [
14 | `rgb(22,28,36)`,
15 | `-moz-linear-gradient(75deg, ${varLow} 0%, ${varHigh} 100%)`,
16 | `-webkit-linear-gradient(75deg, ${varLow} 0%, ${varHigh} 100%)`,
17 | `linear-gradient(75deg, ${varLow} 0%, ${varHigh} 100%)`
18 | ],
19 | '&.MuiBackdrop-invisible': {
20 | background: 'transparent'
21 | }
22 | }
23 | }
24 | }
25 | };
26 | }
27 |
--------------------------------------------------------------------------------
/src/theme/overrides/Badge.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Badge() {
4 | return {
5 | MuiBadge: {
6 | styleOverrides: {
7 | dot: {
8 | width: 10,
9 | height: 10,
10 | borderRadius: '50%'
11 | }
12 | }
13 | }
14 | };
15 | }
16 |
--------------------------------------------------------------------------------
/src/theme/overrides/Breadcrumbs.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Breadcrumbs(theme) {
4 | return {
5 | MuiBreadcrumbs: {
6 | styleOverrides: {
7 | separator: {
8 | marginLeft: theme.spacing(2),
9 | marginRight: theme.spacing(2)
10 | }
11 | }
12 | }
13 | };
14 | }
15 |
--------------------------------------------------------------------------------
/src/theme/overrides/ButtonGroup.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function ButtonGroup(theme) {
4 | const styleContained = (color) => ({
5 | props: { variant: 'contained', color },
6 | style: { boxShadow: theme.customShadows[color] }
7 | });
8 |
9 | return {
10 | MuiButtonGroup: {
11 | variants: [
12 | {
13 | props: { variant: 'contained', color: 'inherit' },
14 | style: { boxShadow: theme.customShadows.z8 }
15 | },
16 | styleContained('primary'),
17 | styleContained('secondary'),
18 | styleContained('info'),
19 | styleContained('success'),
20 | styleContained('warning'),
21 | styleContained('error'),
22 |
23 | {
24 | props: { disabled: true },
25 | style: {
26 | boxShadow: 'none',
27 | '& .MuiButtonGroup-grouped.Mui-disabled': {
28 | color: theme.palette.action.disabled,
29 | borderColor: `${theme.palette.action.disabledBackground} !important`,
30 | '&.MuiButton-contained': {
31 | backgroundColor: theme.palette.action.disabledBackground
32 | }
33 | }
34 | }
35 | }
36 | ],
37 |
38 | styleOverrides: {
39 | root: {
40 | '&:hover': {
41 | boxShadow: 'none'
42 | }
43 | }
44 | }
45 | }
46 | };
47 | }
48 |
--------------------------------------------------------------------------------
/src/theme/overrides/Card.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Card(theme) {
4 | return {
5 | MuiCard: {
6 | styleOverrides: {
7 | root: {
8 | boxShadow: theme.customShadows.z16,
9 | borderRadius: theme.shape.borderRadiusMd,
10 | position: 'relative',
11 | zIndex: 0 // Fix Safari overflow: hidden with border radius
12 | }
13 | }
14 | },
15 | MuiCardHeader: {
16 | defaultProps: {
17 | titleTypographyProps: { variant: 'h6' },
18 | subheaderTypographyProps: {
19 | variant: 'body2',
20 | marginTop: theme.spacing(0.5)
21 | }
22 | },
23 | styleOverrides: {
24 | root: {
25 | padding: theme.spacing(3, 3, 0)
26 | }
27 | }
28 | },
29 | MuiCardContent: {
30 | styleOverrides: {
31 | root: {
32 | padding: theme.spacing(3)
33 | }
34 | }
35 | }
36 | };
37 | }
38 |
--------------------------------------------------------------------------------
/src/theme/overrides/Chip.js:
--------------------------------------------------------------------------------
1 | import { Icon } from '@iconify/react';
2 | import closeCircleFill from '@iconify/icons-eva/close-circle-fill';
3 |
4 | // ----------------------------------------------------------------------
5 |
6 | export default function Chip(theme) {
7 | return {
8 | MuiChip: {
9 | defaultProps: {
10 | deleteIcon:
11 | },
12 |
13 | styleOverrides: {
14 | colorDefault: {
15 | '& .MuiChip-avatarMedium, .MuiChip-avatarSmall': {
16 | color: theme.palette.text.secondary
17 | }
18 | },
19 | outlined: {
20 | borderColor: theme.palette.grey[500_32],
21 | '&.MuiChip-colorPrimary': {
22 | borderColor: theme.palette.primary.main
23 | },
24 | '&.MuiChip-colorSecondary': {
25 | borderColor: theme.palette.secondary.main
26 | }
27 | },
28 | //
29 | avatarColorInfo: {
30 | color: theme.palette.info.contrastText,
31 | backgroundColor: theme.palette.info.dark
32 | },
33 | avatarColorSuccess: {
34 | color: theme.palette.success.contrastText,
35 | backgroundColor: theme.palette.success.dark
36 | },
37 | avatarColorWarning: {
38 | color: theme.palette.warning.contrastText,
39 | backgroundColor: theme.palette.warning.dark
40 | },
41 | avatarColorError: {
42 | color: theme.palette.error.contrastText,
43 | backgroundColor: theme.palette.error.dark
44 | }
45 | }
46 | }
47 | };
48 | }
49 |
--------------------------------------------------------------------------------
/src/theme/overrides/Container.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Container() {
4 | return {
5 | MuiContainer: {
6 | styleOverrides: {
7 | root: {}
8 | }
9 | }
10 | };
11 | }
12 |
--------------------------------------------------------------------------------
/src/theme/overrides/ControlLabel.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function ControlLabel(theme) {
4 | return {
5 | MuiFormControlLabel: {
6 | styleOverrides: {
7 | label: {
8 | ...theme.typography.body2
9 | }
10 | }
11 | },
12 | MuiFormHelperText: {
13 | styleOverrides: {
14 | root: {
15 | marginTop: theme.spacing(1)
16 | }
17 | }
18 | },
19 | MuiFormLabel: {
20 | styleOverrides: {
21 | root: {
22 | color: theme.palette.text.disabled
23 | }
24 | }
25 | }
26 | };
27 | }
28 |
--------------------------------------------------------------------------------
/src/theme/overrides/Drawer.js:
--------------------------------------------------------------------------------
1 | import { alpha } from '@mui/material';
2 |
3 | // ----------------------------------------------------------------------
4 |
5 | export default function Drawer(theme) {
6 | const isLight = theme.palette.mode === 'light';
7 |
8 | return {
9 | MuiDrawer: {
10 | styleOverrides: {
11 | modal: {
12 | '&[role="presentation"]': {
13 | '& .MuiDrawer-paperAnchorLeft': {
14 | boxShadow: `8px 24px 24px 12px ${alpha(theme.palette.grey[900], isLight ? 0.16 : 0.48)}`
15 | },
16 | '& .MuiDrawer-paperAnchorRight': {
17 | boxShadow: `-8px 24px 24px 12px ${alpha(theme.palette.grey[900], isLight ? 0.16 : 0.48)}`
18 | }
19 | }
20 | }
21 | }
22 | }
23 | };
24 | }
25 |
--------------------------------------------------------------------------------
/src/theme/overrides/Fab.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Fab(theme) {
4 | return {
5 | MuiFab: {
6 | defaultProps: {
7 | color: 'primary'
8 | },
9 |
10 | styleOverrides: {
11 | root: {
12 | boxShadow: theme.customShadows.z8,
13 | '&:hover': {
14 | boxShadow: 'none',
15 | backgroundColor: theme.palette.grey[400]
16 | }
17 | },
18 | primary: {
19 | boxShadow: theme.customShadows.primary,
20 | '&:hover': {
21 | backgroundColor: theme.palette.primary.dark
22 | }
23 | },
24 | secondary: {
25 | boxShadow: theme.customShadows.secondary,
26 | '&:hover': {
27 | backgroundColor: theme.palette.secondary.dark
28 | }
29 | },
30 | extended: {
31 | '& svg': {
32 | marginRight: theme.spacing(1)
33 | }
34 | }
35 | }
36 | }
37 | };
38 | }
39 |
--------------------------------------------------------------------------------
/src/theme/overrides/Grid.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Grid() {
4 | return {
5 | MuiGrid: {
6 | styleOverrides: {}
7 | }
8 | };
9 | }
10 |
--------------------------------------------------------------------------------
/src/theme/overrides/IconButton.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function IconButton() {
4 | return {
5 | MuiIconButton: {
6 | styleOverrides: {
7 | root: {}
8 | }
9 | }
10 | };
11 | }
12 |
--------------------------------------------------------------------------------
/src/theme/overrides/Link.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Link() {
4 | return {
5 | MuiLink: {
6 | defaultProps: {
7 | underline: 'hover'
8 | },
9 |
10 | styleOverrides: {
11 | root: {}
12 | }
13 | }
14 | };
15 | }
16 |
--------------------------------------------------------------------------------
/src/theme/overrides/Lists.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Lists(theme) {
4 | return {
5 | MuiListItemIcon: {
6 | styleOverrides: {
7 | root: {
8 | color: 'inherit',
9 | minWidth: 'auto',
10 | marginRight: theme.spacing(2)
11 | }
12 | }
13 | },
14 | MuiListItemAvatar: {
15 | styleOverrides: {
16 | root: {
17 | minWidth: 'auto',
18 | marginRight: theme.spacing(2)
19 | }
20 | }
21 | },
22 | MuiListItemText: {
23 | styleOverrides: {
24 | root: {
25 | marginTop: 0,
26 | marginBottom: 0
27 | },
28 | multiline: {
29 | marginTop: 0,
30 | marginBottom: 0
31 | }
32 | }
33 | }
34 | };
35 | }
36 |
--------------------------------------------------------------------------------
/src/theme/overrides/LoadingButton.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function LoadingButton() {
4 | return {
5 | MuiLoadingButton: {
6 | styleOverrides: {
7 | root: {
8 | '&.MuiButton-text': {
9 | '& .MuiLoadingButton-startIconPendingStart': {
10 | marginLeft: 0
11 | },
12 | '& .MuiLoadingButton-endIconPendingEnd': {
13 | marginRight: 0
14 | }
15 | }
16 | }
17 | }
18 | }
19 | };
20 | }
21 |
--------------------------------------------------------------------------------
/src/theme/overrides/Menu.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Menu(theme) {
4 | return {
5 | MuiMenuItem: {
6 | styleOverrides: {
7 | root: {
8 | '&.Mui-selected': {
9 | backgroundColor: theme.palette.action.selected,
10 | '&:hover': {
11 | backgroundColor: theme.palette.action.hover
12 | }
13 | }
14 | }
15 | }
16 | }
17 | };
18 | }
19 |
--------------------------------------------------------------------------------
/src/theme/overrides/Pagination.js:
--------------------------------------------------------------------------------
1 | import { alpha } from '@mui/material/styles';
2 |
3 | // ----------------------------------------------------------------------
4 |
5 | export default function Pagination(theme) {
6 | return {
7 | MuiPaginationItem: {
8 | styleOverrides: {
9 | root: {
10 | '&.Mui-selected': {
11 | fontWeight: theme.typography.fontWeightBold
12 | }
13 | },
14 | textPrimary: {
15 | '&.Mui-selected': {
16 | color: theme.palette.primary.main,
17 | backgroundColor: alpha(theme.palette.primary.main, 0.08),
18 | '&:hover, &.Mui-focusVisible': {
19 | backgroundColor: `${alpha(theme.palette.primary.main, 0.24)} !important`
20 | }
21 | }
22 | },
23 | outlined: {
24 | border: `1px solid ${theme.palette.grey[500_32]}`
25 | },
26 | outlinedPrimary: {
27 | '&.Mui-selected': {
28 | backgroundColor: alpha(theme.palette.primary.main, 0.08),
29 | border: `1px solid ${alpha(theme.palette.primary.main, 0.24)}`
30 | }
31 | }
32 | }
33 | }
34 | };
35 | }
36 |
--------------------------------------------------------------------------------
/src/theme/overrides/Paper.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Paper() {
4 | return {
5 | MuiPaper: {
6 | defaultProps: {
7 | elevation: 0
8 | },
9 |
10 | styleOverrides: {
11 | root: {
12 | backgroundImage: 'none'
13 | }
14 | }
15 | }
16 | };
17 | }
18 |
--------------------------------------------------------------------------------
/src/theme/overrides/Pickers.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Pickers() {
4 | return {};
5 | }
6 |
--------------------------------------------------------------------------------
/src/theme/overrides/Popover.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Popover(theme) {
4 | return {
5 | MuiPopover: {
6 | styleOverrides: {
7 | paper: {
8 | boxShadow: theme.customShadows.z12
9 | }
10 | }
11 | }
12 | };
13 | }
14 |
--------------------------------------------------------------------------------
/src/theme/overrides/Progress.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Progress(theme) {
4 | const isLight = theme.palette.mode === 'light';
5 |
6 | return {
7 | MuiLinearProgress: {
8 | styleOverrides: {
9 | root: {
10 | borderRadius: 4,
11 | overflow: 'hidden'
12 | },
13 | bar: {
14 | borderRadius: 4
15 | },
16 | colorPrimary: {
17 | backgroundColor: theme.palette.primary[isLight ? 'lighter' : 'darker']
18 | },
19 | buffer: {
20 | backgroundColor: 'transparent'
21 | }
22 | }
23 | }
24 | };
25 | }
26 |
--------------------------------------------------------------------------------
/src/theme/overrides/Radio.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Radio(theme) {
4 | return {
5 | MuiRadio: {
6 | styleOverrides: {
7 | root: {
8 | padding: theme.spacing(1),
9 | svg: {
10 | fontSize: 24,
11 | '&[font-size=small]': {
12 | fontSize: 20
13 | }
14 | }
15 | }
16 | }
17 | }
18 | };
19 | }
20 |
--------------------------------------------------------------------------------
/src/theme/overrides/Rating.js:
--------------------------------------------------------------------------------
1 | import { Icon } from '@iconify/react';
2 | import starFill from '@iconify/icons-eva/star-fill';
3 |
4 | import { SvgIcon } from '@mui/material';
5 |
6 | // ----------------------------------------------------------------------
7 |
8 | const ICON_SMALL = { width: 20, height: 20 };
9 | const ICON_LARGE = { width: 28, height: 28 };
10 |
11 | const ICON = (
12 |
13 |
14 |
15 | );
16 |
17 | export default function Rating(theme) {
18 | return {
19 | MuiRating: {
20 | defaultProps: {
21 | emptyIcon: ICON,
22 | icon: ICON
23 | },
24 |
25 | styleOverrides: {
26 | root: {
27 | '&.Mui-disabled': {
28 | opacity: 0.48
29 | }
30 | },
31 | iconEmpty: { color: theme.palette.grey[500_48] },
32 | sizeSmall: { '& svg': { ...ICON_SMALL } },
33 | sizeLarge: { '& svg': { ...ICON_LARGE } }
34 | }
35 | }
36 | };
37 | }
38 |
--------------------------------------------------------------------------------
/src/theme/overrides/Select.js:
--------------------------------------------------------------------------------
1 | import ExpandMoreRoundedIcon from '@mui/icons-material/ExpandMoreRounded';
2 |
3 | // ----------------------------------------------------------------------
4 |
5 | export default function Select() {
6 | return {
7 | MuiSelect: {
8 | defaultProps: {
9 | IconComponent: ExpandMoreRoundedIcon
10 | },
11 |
12 | styleOverrides: {
13 | root: {}
14 | }
15 | }
16 | };
17 | }
18 |
--------------------------------------------------------------------------------
/src/theme/overrides/Skeleton.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Skeleton(theme) {
4 | return {
5 | MuiSkeleton: {
6 | defaultProps: {
7 | animation: 'wave'
8 | },
9 |
10 | styleOverrides: {
11 | root: {
12 | backgroundColor: theme.palette.background.neutral
13 | }
14 | }
15 | }
16 | };
17 | }
18 |
--------------------------------------------------------------------------------
/src/theme/overrides/Slider.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Slider(theme) {
4 | const isLight = theme.palette.mode === 'light';
5 |
6 | return {
7 | MuiSlider: {
8 | defaultProps: {
9 | size: 'small'
10 | },
11 |
12 | styleOverrides: {
13 | root: {
14 | '&.Mui-disabled': {
15 | color: theme.palette.action.disabled
16 | }
17 | },
18 | markLabel: {
19 | fontSize: 13,
20 | color: theme.palette.text.disabled
21 | },
22 | valueLabel: {
23 | borderRadius: 8,
24 | backgroundColor: theme.palette.grey[isLight ? 800 : 700]
25 | }
26 | }
27 | }
28 | };
29 | }
30 |
--------------------------------------------------------------------------------
/src/theme/overrides/Snackbar.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Snackbar() {
4 | return {
5 | MuiSnackbarContent: {
6 | styleOverrides: {
7 | root: {}
8 | }
9 | }
10 | };
11 | }
12 |
--------------------------------------------------------------------------------
/src/theme/overrides/Stepper.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Stepper(theme) {
4 | return {
5 | MuiStepConnector: {
6 | styleOverrides: {
7 | line: {
8 | borderColor: theme.palette.divider
9 | }
10 | }
11 | }
12 | };
13 | }
14 |
--------------------------------------------------------------------------------
/src/theme/overrides/SvgIcon.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function SvgIcon() {
4 | return {
5 | MuiSvgIcon: {
6 | styleOverrides: {
7 | fontSizeSmall: {
8 | width: 20,
9 | height: 20,
10 | fontSize: 'inherit'
11 | },
12 | fontSizeLarge: {
13 | width: 32,
14 | height: 32,
15 | fontSize: 'inherit'
16 | }
17 | }
18 | }
19 | };
20 | }
21 |
--------------------------------------------------------------------------------
/src/theme/overrides/Switch.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Switch(theme) {
4 | const isLight = theme.palette.mode === 'light';
5 |
6 | return {
7 | MuiSwitch: {
8 | styleOverrides: {
9 | thumb: {
10 | boxShadow: theme.customShadows.z1
11 | },
12 | track: {
13 | opacity: 1,
14 | backgroundColor: theme.palette.grey[500]
15 | },
16 | switchBase: {
17 | left: 0,
18 | right: 'auto',
19 | '&:not(:.Mui-checked)': {
20 | color: theme.palette.grey[isLight ? 100 : 300]
21 | },
22 | '&.Mui-checked.Mui-disabled, &.Mui-disabled': {
23 | color: theme.palette.grey[isLight ? 400 : 600]
24 | },
25 | '&.Mui-disabled+.MuiSwitch-track': {
26 | opacity: 1,
27 | backgroundColor: `${theme.palette.action.disabledBackground} !important`
28 | }
29 | }
30 | }
31 | }
32 | };
33 | }
34 |
--------------------------------------------------------------------------------
/src/theme/overrides/Tabs.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Tabs(theme) {
4 | return {
5 | MuiTab: {
6 | styleOverrides: {
7 | root: {
8 | padding: 0,
9 | fontWeight: theme.typography.fontWeightMedium,
10 | borderTopLeftRadius: theme.shape.borderRadius,
11 | borderTopRightRadius: theme.shape.borderRadius,
12 | '&.Mui-selected': {
13 | color: theme.palette.text.primary
14 | },
15 | '&:not(:last-of-type)': {
16 | marginRight: theme.spacing(5)
17 | },
18 | '@media (min-width: 600px)': {
19 | minWidth: 48
20 | }
21 | },
22 | labelIcon: {
23 | minHeight: 48,
24 | flexDirection: 'row',
25 | '& > *:first-of-type': {
26 | marginBottom: 0,
27 | marginRight: theme.spacing(1)
28 | }
29 | },
30 | wrapper: {
31 | flexDirection: 'row',
32 | whiteSpace: 'nowrap'
33 | },
34 | textColorInherit: {
35 | opacity: 1,
36 | color: theme.palette.text.secondary
37 | }
38 | }
39 | },
40 | MuiTabPanel: {
41 | styleOverrides: {
42 | root: {
43 | padding: 0
44 | }
45 | }
46 | },
47 | MuiTabScrollButton: {
48 | styleOverrides: {
49 | root: {
50 | width: 48,
51 | borderRadius: '50%'
52 | }
53 | }
54 | }
55 | };
56 | }
57 |
--------------------------------------------------------------------------------
/src/theme/overrides/Timeline.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Timeline(theme) {
4 | return {
5 | MuiTimelineDot: {
6 | styleOverrides: {
7 | root: {
8 | boxShadow: 'none'
9 | }
10 | }
11 | },
12 |
13 | MuiTimelineConnector: {
14 | styleOverrides: {
15 | root: {
16 | backgroundColor: theme.palette.divider
17 | }
18 | }
19 | }
20 | };
21 | }
22 |
--------------------------------------------------------------------------------
/src/theme/overrides/ToggleButton.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function ToggleButton(theme) {
4 | return {
5 | MuiToggleButton: {
6 | styleOverrides: {
7 | root: {
8 | color: theme.palette.grey[500],
9 | border: `solid 1px ${theme.palette.grey[500_32]}`,
10 | '&.Mui-selected': {
11 | backgroundColor: theme.palette.action.selected
12 | },
13 | '&.Mui-disabled': {
14 | color: theme.palette.grey[500_48]
15 | }
16 | }
17 | }
18 | }
19 | };
20 | }
21 |
--------------------------------------------------------------------------------
/src/theme/overrides/Tooltip.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Tooltip(theme) {
4 | const isLight = theme.palette.mode === 'light';
5 |
6 | return {
7 | MuiTooltip: {
8 | styleOverrides: {
9 | tooltip: {
10 | backgroundColor: theme.palette.grey[isLight ? 800 : 700]
11 | },
12 | arrow: {
13 | color: theme.palette.grey[isLight ? 800 : 700]
14 | }
15 | }
16 | }
17 | };
18 | }
19 |
--------------------------------------------------------------------------------
/src/theme/overrides/TreeView.js:
--------------------------------------------------------------------------------
1 | import { Icon } from '@iconify/react';
2 | import plusSquareOutline from '@iconify/icons-eva/plus-square-outline';
3 | import minusSquareOutline from '@iconify/icons-eva/minus-square-outline';
4 | import closeSquareOutline from '@iconify/icons-eva/close-square-outline';
5 |
6 | import { Box } from '@mui/material';
7 |
8 | // ----------------------------------------------------------------------
9 |
10 | const ICON_SIZE = { width: 20, height: 20 };
11 |
12 | export default function TreeView(theme) {
13 | return {
14 | MuiTreeView: {
15 | defaultProps: {
16 | defaultCollapseIcon: ,
17 | defaultExpandIcon: ,
18 | defaultEndIcon: (
19 |
20 | )
21 | }
22 | },
23 | MuiTreeItem: {
24 | styleOverrides: {
25 | label: { ...theme.typography.body2 },
26 | iconContainer: { width: 'auto' }
27 | }
28 | }
29 | };
30 | }
31 |
--------------------------------------------------------------------------------
/src/theme/overrides/Typography.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export default function Typography(theme) {
4 | return {
5 | MuiTypography: {
6 | styleOverrides: {
7 | paragraph: {
8 | marginBottom: theme.spacing(2)
9 | },
10 | gutterBottom: {
11 | marginBottom: theme.spacing(1)
12 | }
13 | }
14 | }
15 | };
16 | }
17 |
--------------------------------------------------------------------------------
/src/theme/shape.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | const shape = {
4 | borderRadius: 16,
5 | borderRadiusSm: 16,
6 | borderRadiusMd: 16
7 | };
8 |
9 | export default shape;
10 |
--------------------------------------------------------------------------------
/src/utils/analytics.js:
--------------------------------------------------------------------------------
1 | import { googleAnalyticsConfig } from '../config';
2 |
3 | // ----------------------------------------------------------------------
4 |
5 | const setup = (...args) => {
6 | if (process.env.NODE_ENV !== 'production') {
7 | return;
8 | }
9 | if (!window.gtag) {
10 | return;
11 | }
12 | window.gtag(...args);
13 | };
14 |
15 | const track = {
16 | pageview: (props) => {
17 | setup('config', googleAnalyticsConfig, props);
18 | },
19 | event: (type, props) => {
20 | setup('event', type, props);
21 | }
22 | };
23 |
24 | export default track;
25 |
--------------------------------------------------------------------------------
/src/utils/formatNumber.js:
--------------------------------------------------------------------------------
1 | import { replace } from 'lodash';
2 | import numeral from 'numeral';
3 |
4 | // ----------------------------------------------------------------------
5 |
6 | export function fCurrency(number) {
7 | return numeral(number).format(Number.isInteger(number) ? '$0,0' : '$0,0.00');
8 | }
9 |
10 | export function fPercent(number) {
11 | return numeral(number / 100).format('0.0%');
12 | }
13 |
14 | export function fNumber(number) {
15 | return numeral(number).format();
16 | }
17 |
18 | export function fShortenNumber(number) {
19 | return replace(numeral(number).format('0.00a'), '.00', '');
20 | }
21 |
22 | export function fData(number) {
23 | return numeral(number).format('0.0 b');
24 | }
25 |
--------------------------------------------------------------------------------
/src/utils/gitInfo.js:
--------------------------------------------------------------------------------
1 | const fs = require('fs');
2 | const path = require('path');
3 | const { execSync } = require('child_process');
4 |
5 | const execSyncWrapper = (command) => {
6 | let stdout = null;
7 | try {
8 | stdout = execSync(command).toString().trim();
9 | } catch (error) {
10 | console.error(error);
11 | }
12 | return stdout;
13 | };
14 |
15 | const main = () => {
16 | const gitBranch = execSyncWrapper('git rev-parse --abbrev-ref HEAD');
17 | const gitCommitHash = execSyncWrapper('git rev-parse --short=7 HEAD');
18 |
19 | const obj = {
20 | gitBranch,
21 | gitCommitHash
22 | };
23 |
24 | const filePath = path.resolve('src', 'generatedGitInfo.json');
25 | const fileContents = JSON.stringify(obj, null, 2);
26 |
27 | fs.writeFileSync(filePath, fileContents);
28 | console.log(`Wrote the following contents to ${filePath}\n${fileContents}`);
29 | };
30 |
31 | main();
32 |
--------------------------------------------------------------------------------
/src/utils/highlight.js:
--------------------------------------------------------------------------------
1 | import hljs from 'highlight.js';
2 | import 'highlight.js/styles/atom-one-dark.css';
3 |
4 | // ----------------------------------------------------------------------
5 |
6 | hljs.configure({
7 | languages: ['javascript', 'jsx', 'sh', 'bash', 'html', 'scss', 'css', 'json']
8 | });
9 |
10 | window.hljs = hljs;
11 |
--------------------------------------------------------------------------------
/src/utils/mock-data/boolean.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export const boolean = [
4 | true,
5 | true,
6 | true,
7 | false,
8 | false,
9 | true,
10 | false,
11 | false,
12 | false,
13 | false,
14 | true,
15 | true,
16 | true,
17 | false,
18 | false,
19 | false,
20 | true,
21 | false,
22 | false,
23 | false,
24 | true,
25 | false,
26 | false,
27 | true,
28 | true,
29 | true,
30 | false,
31 | false,
32 | true,
33 | true,
34 | false,
35 | true,
36 | false,
37 | true,
38 | true,
39 | true,
40 | false,
41 | true,
42 | false,
43 | false
44 | ];
45 |
--------------------------------------------------------------------------------
/src/utils/mock-data/company.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export const company = [
4 | 'Lueilwitz and Sons',
5 | 'Gleichner, Mueller and Tromp',
6 | 'Nikolaus - Leuschke',
7 | 'Hegmann, Kreiger and Bayer',
8 | 'Grimes Inc',
9 | 'Durgan - Murazik',
10 | 'Altenwerth, Medhurst and Roberts',
11 | 'Raynor Group',
12 | 'Mraz, Donnelly and Collins',
13 | 'Padberg - Bailey',
14 | 'Heidenreich, Stokes and Parker',
15 | 'Pagac and Sons',
16 | 'Rempel, Hand and Herzog',
17 | 'Dare - Treutel',
18 | 'Kihn, Marquardt and Crist',
19 | 'Nolan - Kunde',
20 | 'Wuckert Inc',
21 | 'Dibbert Inc',
22 | 'Goyette and Sons',
23 | 'Feest Group',
24 | 'Bosco and Sons',
25 | 'Bartell - Kovacek',
26 | 'Schimmel - Raynor',
27 | 'Tremblay LLC',
28 | 'Hills - Mitchell',
29 | 'Rogahn LLC',
30 | 'Kuhn, Osinski and Morar',
31 | 'Schmitt Inc',
32 | 'Breitenberg - Rosenbaum',
33 | "O'Keefe, Schneider and Mraz",
34 | 'Rohan, Langworth and Kling',
35 | 'Morar and Sons',
36 | 'Mraz LLC',
37 | 'Rowe, Parisian and Kub',
38 | 'Marquardt - Hane',
39 | 'Medhurst Group',
40 | 'Nikolaus - Lang',
41 | 'Effertz, Mohr and Olson',
42 | 'Anderson - Kris',
43 | 'Runolfsson Group'
44 | ];
45 |
--------------------------------------------------------------------------------
/src/utils/mock-data/email.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export const email = [
4 | 'nannie_abernathy70@yahoo.com',
5 | 'ashlynn_ohara62@gmail.com',
6 | 'milo.farrell@hotmail.com',
7 | 'violet.ratke86@yahoo.com',
8 | 'letha_lubowitz24@yahoo.com',
9 | 'aditya_greenfelder31@gmail.com',
10 | 'lenna_bergnaum27@hotmail.com',
11 | 'luella.ryan33@gmail.com',
12 | 'joana.simonis84@gmail.com',
13 | 'marjolaine_white94@gmail.com',
14 | 'vergie_block82@hotmail.com',
15 | 'vito.hudson@hotmail.com',
16 | 'tyrel_greenholt@gmail.com',
17 | 'dwight.block85@yahoo.com',
18 | 'mireya13@hotmail.com',
19 | 'dasia_jenkins@hotmail.com',
20 | 'benny89@yahoo.com',
21 | 'dawn.goyette@gmail.com',
22 | 'zella_hickle4@yahoo.com',
23 | 'avery43@hotmail.com',
24 | 'olen_legros@gmail.com',
25 | 'jimmie.gerhold73@hotmail.com',
26 | 'genevieve.powlowski@hotmail.com',
27 | 'louie.kuphal39@gmail.com',
28 | 'enoch.cruickshank@gmail.com',
29 | 'arlo_mccullough@gmail.com',
30 | 'sadie18@yahoo.com',
31 | 'aric67@gmail.com',
32 | 'mack_deckow53@gmail.com',
33 | 'constantin91@yahoo.com',
34 | 'lonny84@hotmail.com',
35 | 'gus56@hotmail.com',
36 | 'brennon64@yahoo.com',
37 | 'hortense.streich@hotmail.com',
38 | 'kallie_powlowski57@hotmail.com',
39 | 'meghan.kemmer@hotmail.com',
40 | 'bella.mraz14@yahoo.com',
41 | 'barney88@gmail.com',
42 | 'diamond_johns@hotmail.com',
43 | 'gus80@hotmail.com'
44 | ];
45 |
--------------------------------------------------------------------------------
/src/utils/mock-data/number.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export const price = [
4 | 16.19, 35.71, 34.3, 93.1, 55.47, 89.09, 44.39, 26.92, 45.35, 26.96, 78.22, 35.54, 90.69, 63.61, 67.55, 94.75, 75.78,
5 | 39.6, 52.84, 72.8, 83.08, 85.02, 69.22, 60.96, 84.7, 16.68, 78.83, 58.07, 65.8, 55.69, 87.55, 44.74, 27.42, 84, 76.17,
6 | 43.83, 76.39, 17.42, 42.3, 12.45
7 | ];
8 |
9 | export const rating = [
10 | 2.5, 2, 4.9, 2, 4, 5, 4.9, 5, 3.7, 2.5, 2, 4.9, 4.8, 4, 2, 3.7, 1.4, 2.4, 1.8, 5, 2.9, 3.9, 3.9, 1.8, 5, 2.6, 3.1,
11 | 3.9, 1.2, 3.2, 4.1, 5, 4.5, 4.1, 2.3, 2.4, 5, 3.1, 4.9, 1.7
12 | ];
13 |
14 | export const age = [
15 | 52, 43, 56, 25, 22, 53, 38, 50, 55, 37, 16, 27, 55, 41, 52, 32, 34, 52, 31, 53, 23, 48, 43, 41, 19, 21, 17, 29, 32,
16 | 54, 38, 34, 49, 33, 55, 50, 24, 27, 23, 23
17 | ];
18 |
19 | export const percent = [
20 | 8.62, 86.36, 73.99, 79, 63.41, 58.79, 12.32, 88.44, 45.06, 91.64, 88.41, 73.08, 39.14, 89.34, 43.37, 34.45, 24.04,
21 | 80.96, 72.91, 47.59, 2.46, 3.33, 99.31, 47.6, 34.09, 50.61, 66.13, 46.69, 92.43, 31.41, 90.85, 36.32, 38.84, 25.6,
22 | 87.61, 1.31, 89.32, 41.23, 85.9, 62.63
23 | ];
24 |
--------------------------------------------------------------------------------
/src/utils/mock-data/phoneNumber.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export const phoneNumber = [
4 | '365-374-4961',
5 | '904-966-2836',
6 | '399-757-9909',
7 | '692-767-2903',
8 | '990-588-5716',
9 | '955-439-2578',
10 | '226-924-4058',
11 | '552-917-1454',
12 | '285-840-9338',
13 | '306-269-2446',
14 | '883-373-6253',
15 | '476-509-8866',
16 | '201-465-1954',
17 | '538-295-9408',
18 | '531-492-6028',
19 | '981-699-7588',
20 | '500-268-4826',
21 | '205-952-3828',
22 | '222-255-5190',
23 | '408-439-8033',
24 | '272-940-8266',
25 | '812-685-8057',
26 | '353-801-5212',
27 | '606-285-8928',
28 | '202-767-8621',
29 | '222-830-0731',
30 | '964-940-3166',
31 | '262-702-2396',
32 | '886-261-9789',
33 | '352-390-5069',
34 | '343-907-8334',
35 | '575-347-2399',
36 | '749-228-5604',
37 | '774-452-2071',
38 | '607-841-0447',
39 | '395-619-2157',
40 | '233-834-0373',
41 | '586-880-2602',
42 | '746-772-0722',
43 | '638-615-3365,'
44 | ];
45 |
--------------------------------------------------------------------------------
/src/utils/mock-data/role.js:
--------------------------------------------------------------------------------
1 | // ----------------------------------------------------------------------
2 |
3 | export const role = [
4 | 'UX Designer',
5 | 'Full Stack Designer',
6 | 'Backend Developer',
7 | 'UX Designer',
8 | 'UX Designer',
9 | 'Project Manager',
10 | 'Leader',
11 | 'Backend Developer',
12 | 'Project Manager',
13 | 'UI Designer',
14 | 'UI/UX Designer',
15 | 'UI/UX Designer',
16 | 'UI Designer',
17 | 'Backend Developer',
18 | 'Backend Developer',
19 | 'Front End Developer',
20 | 'Backend Developer',
21 | 'Full Stack Designer',
22 | 'Full Stack Developer',
23 | 'Backend Developer',
24 | 'UX Designer',
25 | 'UI Designer',
26 | 'Project Manager',
27 | 'UI/UX Designer',
28 | 'UI Designer',
29 | 'Project Manager',
30 | 'Full Stack Developer',
31 | 'Hr Manager',
32 | 'Hr Manager',
33 | 'UI/UX Designer',
34 | 'Project Manager',
35 | 'Full Stack Designer',
36 | 'UI Designer',
37 | 'Leader',
38 | 'Front End Developer',
39 | 'UI/UX Designer',
40 | 'Project Manager',
41 | 'UI/UX Designer',
42 | 'UI Designer',
43 | 'Full Stack Designer'
44 | ];
45 |
--------------------------------------------------------------------------------