Merge pull request #5 from AkshataKatwal16/admin

Issue feat: #PS-986 add layout design -vertical horizontal navbar and footer

public/locales/en/common.json

@@ -12,5 +12,13 @@
     "USERNAME_PASSWORD_NOT_CORRECT": "The username or password you entered is incorrect",
     "FORGOT_PASSWORD": "Forgot Password?",
     "REMEMBER_ME": "Remember Me"
+  },
+  "DASHBOARD":
+  {
+    "HI":"hi",
+    "DASHBOARD":"Dashboard",
+    "MANAGE_USER":"Manage Users",
+    "COURSE_PLANNER":"Course Planner",
+    "COHORTS":"Cohorts"
   }
 }

src/components/Link.tsx

@@ -0,0 +1,225 @@
+// import * as React from 'react';
+// import PropTypes from 'prop-types';
+// import clsx from 'clsx';
+// import { useRouter } from 'next/router';
+// import NextLink from 'next/link';
+// import MuiLink from '@mui/material/Link';
+// import { styled } from '@mui/material/styles';
+
+// // Add support for the sx prop for consistency with the other branches.
+// const Anchor = styled('a')({});
+
+// export const NextLinkComposed = React.forwardRef(function NextLinkComposed(props, ref) {
+//   const { to, linkAs, href, replace, scroll, shallow, prefetch, locale, ...other } = props;
+
+//   return (
+//     <NextLink
+//       href={to}
+//       prefetch={prefetch}
+//       as={linkAs}
+//       replace={replace}
+//       scroll={scroll}
+//       shallow={shallow}
+//       passHref
+//       locale={locale}
+//     >
+//       <Anchor ref={ref} {...other} />
+//     </NextLink>
+//   );
+// });
+
+// NextLinkComposed.propTypes = {
+//   href: PropTypes.any,
+//   linkAs: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
+//   locale: PropTypes.string,
+//   passHref: PropTypes.bool,
+//   prefetch: PropTypes.bool,
+//   replace: PropTypes.bool,
+//   scroll: PropTypes.bool,
+//   shallow: PropTypes.bool,
+//   to: PropTypes.oneOfType([PropTypes.object, PropTypes.string]).isRequired,
+// };
+
+// // A styled version of the Next.js Link component:
+// // https://nextjs.org/docs/api-reference/next/link
+// const Link = React.forwardRef(function Link(props, ref) {
+//   const {
+//     activeClassName = 'active',
+//     as: linkAs,
+//     className: classNameProps,
+//     href,
+//     noLinkStyle,
+//     role, // Link don't have roles.
+//     ...other
+//   } = props;
+
+//   const router = useRouter();
+//   const pathname = typeof href === 'string' ? href : href.pathname;
+//   const className = clsx(classNameProps, {
+//     [activeClassName]: router.pathname === pathname && activeClassName,
+//   });
+
+//   const isExternal =
+//     typeof href === 'string' && (href.indexOf('http') === 0 || href.indexOf('mailto:') === 0);
+
+//   if (isExternal) {
+//     if (noLinkStyle) {
+//       return <Anchor className={className} href={href} ref={ref} {...other} />;
+//     }
+
+//     return <MuiLink className={className} href={href} ref={ref} {...other} />;
+//   }
+
+//   if (noLinkStyle) {
+//     return <NextLinkComposed className={className} ref={ref} to={href} {...other} />;
+//   }
+
+//   return (
+//     <MuiLink
+//       component={NextLinkComposed}
+//       linkAs={linkAs}
+//       className={className}
+//       ref={ref}
+//       to={href}
+//       {...other}
+//     />
+//   );
+// });
+
+// Link.propTypes = {
+//   activeClassName: PropTypes.string,
+//   as: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
+//   className: PropTypes.string,
+//   href: PropTypes.any,
+//   linkAs: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
+//   noLinkStyle: PropTypes.bool,
+//   role: PropTypes.string,
+// };
+
+// export default Link;
+
+
+
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { useRouter } from 'next/router';
+import NextLink from 'next/link';
+import MuiLink, { LinkProps as MuiLinkProps } from '@mui/material/Link';
+import { styled } from '@mui/material/styles';
+
+// Add support for the sx prop for consistency with the other branches.
+const Anchor: any = styled('a')({});
+
+export interface NextLinkComposedProps {
+  to: string | { pathname: string };
+  linkAs?: string | object;
+  href?: any;
+  replace?: boolean;
+  scroll?: boolean;
+  shallow?: boolean;
+  prefetch?: boolean;
+  locale?: string;
+  passHref?: boolean;
+  className?: string;
+}
+
+export const NextLinkComposed = React.forwardRef<HTMLAnchorElement, NextLinkComposedProps>(
+  function NextLinkComposed(props, ref) {
+    const { to, linkAs, href, replace, scroll, shallow, prefetch, locale, ...other } = props;
+
+    return (
+      <NextLink
+        href={to}
+        prefetch={prefetch}
+        as={linkAs}
+        replace={replace}
+        scroll={scroll}
+        shallow={shallow}
+        passHref
+        locale={locale}
+      >
+        <Anchor ref={ref as React.MutableRefObject<HTMLAnchorElement>} {...other} />
+      </NextLink>
+    );
+  }
+);
+
+// NextLinkComposed.propTypes = {
+//   href: PropTypes.any,
+//   linkAs: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
+//   locale: PropTypes.string,
+//   passHref: PropTypes.bool,
+//   prefetch: PropTypes.bool,
+//   replace: PropTypes.bool,
+//   scroll: PropTypes.bool,
+//   shallow: PropTypes.bool,
+//   to: PropTypes.oneOfType([PropTypes.object, PropTypes.string]).isRequired,
+// };
+
+export interface LinkProps extends MuiLinkProps {
+  activeClassName?: string;
+  as?: string | object;
+  noLinkStyle?: boolean;
+  role?: string;
+  href?: any;
+}
+
+// A styled version of the Next.js Link component:
+// https://nextjs.org/docs/api-reference/next/link
+const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(function Link(props, ref) {
+  const {
+    activeClassName = 'active',
+    as: linkAs,
+    className: classNameProps,
+    href,
+    noLinkStyle,
+    role, // Link don't have roles.
+
+    ...other
+  } = props;
+
+  const router = useRouter();
+  const pathname = typeof href === 'string' ? href : href?.pathname;
+  const className = clsx(classNameProps, {
+    [activeClassName!]: router.pathname === pathname && activeClassName,
+  });
+
+  const isExternal =
+    typeof href === 'string' && (href.indexOf('http') === 0 || href.indexOf('mailto:') === 0);
+
+  if (isExternal) {
+    if (noLinkStyle) {
+      return <Anchor className={className} href={href} ref={ref as React.MutableRefObject<HTMLAnchorElement>} {...other} />;
+    }
+
+    return <MuiLink className={className} href={href} ref={ref as React.MutableRefObject<HTMLAnchorElement>} {...other} />;
+  }
+
+  if (noLinkStyle) {
+    return <NextLinkComposed className={className} ref={ref as React.MutableRefObject<HTMLAnchorElement>} to={href} {...other} />;
+  }
+
+  return (
+    <MuiLink
+      component={NextLinkComposed}
+      linkAs={linkAs}
+      className={className}
+      ref={ref as React.MutableRefObject<HTMLAnchorElement>}
+      to={href}
+      {...other}
+    />
+  );
+});
+
+// Link.propTypes = {
+//   activeClassName: PropTypes.string,
+//   as: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
+//   className: PropTypes.string,
+//   href: PropTypes.any,
+//   linkAs: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
+//   noLinkStyle: PropTypes.bool,
+//   role: PropTypes.string,
+// };
+
+export default Link;

src/components/createEmotionCache.tsx

@@ -0,0 +1,5 @@
+import createCache from '@emotion/cache';
+
+export default function createEmotionCache() {
+  return createCache({ key: 'css' });
+}