freeCodeCamp · Zeko369 · Aug 2, 2020 · Aug 2, 2020 · Aug 2, 2020 · Aug 2, 2020
diff --git a/client/.gitignore b/client/.gitignore
@@ -0,0 +1,37 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# vercel
+.vercel
+
+src/generated/
+graphql.schema.json
diff --git a/client/README.md b/client/README.md
@@ -0,0 +1,13 @@
+This example shows how to integrate the TypeScript type system into Next.js. Since TypeScript is supported out of the box with Next.js, all we have to do is to install TypeScript.
+
+This example shows how to properly export and import typescript types without getting the
+
+```js
+Attempted import error: 'TypeA' is not exported from './package-1'.
+```
+
+error as raised in [vercel/next.js#7882](https://github.com/vercel/next.js/issues/7882).
+
+## Useful links
+
+[Add import type and export type support to TypeScript](https://github.com/babel/babel/pull/11171)
diff --git a/client/codegen.js b/client/codegen.js
@@ -0,0 +1,27 @@
+module.exports = {
+  schema: [{ 'http://localhost:4000/graphql': {} }],
+  documents: ['./src/**/graphql/*.ts'],
+  overwrite: true,
+  generates: {
+    './src/generated/index.tsx': {
+      plugins: [
+        'typescript',
+        'typescript-operations',
+        'typescript-react-apollo',
+      ],
+      config: {
+        skipTypename: false,
+        withHooks: true,
+        withHOC: false,
+        withComponent: false,
+        apolloReactCommonImportFrom: '@apollo/client',
+        apolloReactComponentsImportFrom: '@apollo/client',
+        apolloReactHocImportFrom: '@apollo/client',
+        apolloReactHooksImportFrom: '@apollo/client',
+      },
+    },
+    './graphql.schema.json': {
+      plugins: ['introspection'],
+    },
+  },
+};
diff --git a/client/components/SomeComponent/__test__/Index.test.tsx b/client/components/SomeComponent/__test__/Index.test.tsx
diff --git a/client/components/SomeComponent/__test__/__snapshots__/Index.test.tsx.snap b/client/components/SomeComponent/__test__/__snapshots__/Index.test.tsx.snap
diff --git a/client/components/SomeComponent/index.tsx b/client/components/SomeComponent/index.tsx
diff --git a/client/components/index.ts b/client/components/index.ts
diff --git a/client/interfaces/models.d.ts b/client/interfaces/models.d.ts
diff --git a/client/modules/home.tsx b/client/modules/home.tsx
diff --git a/client/next-env.d.ts b/client/next-env.d.ts
@@ -0,0 +1,2 @@
+/// <reference types="next" />
+/// <reference types="next/types/global" />
diff --git a/client/package.json b/client/package.json
@@ -0,0 +1,41 @@
+{
+  "name": "chapter-client",
+  "version": "1.0.0",
+  "main": "index.js",
+  "scripts": {
+    "dev": "next",
+    "build": "next build",
+    "start": "next start",
+    "gen": "graphql-codegen --config codegen.js"
+  },
+  "dependencies": {
+    "@apollo/client": "^3.1.1",
+    "@material-ui/core": "^4.5.2",
+    "@material-ui/icons": "^4.5.1",
+    "@types/react-redux": "^7.1.7",
+    "graphql": "^15.3.0",
+    "immer": "^3.2.0",
+    "next": "^9.5.1",
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1",
+    "react-hook-form": "^4.9.3",
+    "react-redux": "^7.1.0",
+    "redux": "^4.0.4",
+    "redux-thunk": "^2.3.0"
+  },
+  "devDependencies": {
+    "@graphql-codegen/cli": "1.17.7",
+    "@graphql-codegen/introspection": "1.17.7",
+    "@graphql-codegen/typescript": "1.17.7",
+    "@graphql-codegen/typescript-operations": "1.17.7",
+    "@graphql-codegen/typescript-react-apollo": "1.17.7",
+    "@types/node": "^12.12.21",
+    "@types/react": "^16.9.44",
+    "@types/react-dom": "^16.9.8",
+    "typescript": "^3.9.7",
+    "@graphql-codegen/typescript-graphql-files-modules": "1.17.7",
+    "@graphql-codegen/typescript-document-nodes": "1.17.7",
+    "@graphql-codegen/fragment-matcher": "1.17.7"
+  },
+  "license": "MIT"
+}
diff --git a/public/freecodecamp-logo.svg → client/public/freecodecamp-logo.svg b/public/freecodecamp-logo.svg → client/public/freecodecamp-logo.svg
diff --git a/client/@types/global.d.ts → client/src/@types/global.d.ts b/client/@types/global.d.ts → client/src/@types/global.d.ts
diff --git a/client/@types/http-service.d.ts → client/src/@types/http-service.d.ts b/client/@types/http-service.d.ts → client/src/@types/http-service.d.ts
diff --git a/client/components/PageLayout/Header.tsx → client/src/components/PageLayout/Header.tsx b/client/components/PageLayout/Header.tsx → client/src/components/PageLayout/Header.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import Link from 'next/link';
 import { makeStyles, Grid } from '@material-ui/core';
 
-import { headerLinks } from 'client/constants/Header';
+import { headerLinks } from '../../constants/Header';
 
 const useStyles = makeStyles({
   link: {
@@ -14,7 +14,7 @@ const useStyles = makeStyles({
   },
 });
 
-const Header = ({ classes }) => {
+const Header: React.FC<{ classes: Record<string, any> }> = ({ classes }) => {
   const styles = useStyles();
 
   return (

diff --git a/client/components/PageLayout/index.tsx → client/src/components/PageLayout/index.tsx b/client/components/PageLayout/index.tsx → client/src/components/PageLayout/index.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 import Header from './Header';
 import usePageLayoutStyles from './pageLayout.styles';
 
-const PageLayout = ({ children }) => {
+const PageLayout: React.FC = ({ children }) => {
   const classes = usePageLayoutStyles();
   return (
     <>

diff --git a/...omponents/PageLayout/pageLayout.styles.ts → ...omponents/PageLayout/pageLayout.styles.ts b/...omponents/PageLayout/pageLayout.styles.ts → ...omponents/PageLayout/pageLayout.styles.ts
diff --git a/client/components/ProgressCardContent.tsx → ...nt/src/components/ProgressCardContent.tsx b/client/components/ProgressCardContent.tsx → ...nt/src/components/ProgressCardContent.tsx
diff --git a/client/src/components/index.ts b/client/src/components/index.ts
@@ -0,0 +1,4 @@
+import AddSponsor from '../modules/dashboard/AddSponsor';
+import ProgressCardContent from './ProgressCardContent';
+
+export { AddSponsor, ProgressCardContent };
diff --git a/client/constants/DashboardLinks.ts → client/src/constants/DashboardLinks.ts b/client/constants/DashboardLinks.ts → client/src/constants/DashboardLinks.ts
diff --git a/client/constants/Header.ts → client/src/constants/Header.ts b/client/constants/Header.ts → client/src/constants/Header.ts
diff --git a/client/helpers/getLocationString.ts → client/src/helpers/getLocationString.ts b/client/helpers/getLocationString.ts → client/src/helpers/getLocationString.ts
@@ -1,4 +1,4 @@
-import { ILocationModal } from 'client/store/types/locations';
+import { ILocationModal } from '../modules/dashboard/Dashboard/Locations/node_modules/client/store/types/locations';
 
 const getLocationString = (
   location: ILocationModal,

diff --git a/client/helpers/sanitizeFormData.ts → client/src/helpers/sanitizeFormData.ts b/client/helpers/sanitizeFormData.ts → client/src/helpers/sanitizeFormData.ts
@@ -10,7 +10,7 @@ const sanitizeFormData = (data: Obj): Obj => {
     }
 
     return prev;
-  }, {});
+  }, {} as Obj);
 };
 
 export default sanitizeFormData;
diff --git a/client/hooks/useConfirm.ts → client/src/hooks/useConfirm.ts b/client/hooks/useConfirm.ts → client/src/hooks/useConfirm.ts
diff --git a/client/hooks/useThunkDispatch.ts → client/src/hooks/useThunkDispatch.ts b/client/hooks/useThunkDispatch.ts → client/src/hooks/useThunkDispatch.ts
diff --git a/client/components/AddSponsor.tsx → client/src/modules/dashboard/AddSponsor.tsx b/client/components/AddSponsor.tsx → client/src/modules/dashboard/AddSponsor.tsx
@@ -34,7 +34,7 @@ const AddSponsor: React.FC = () => {
   // const eventId = useSelector(state => state.selectedChapter.eventId);
   // const chapterId = useSelector(state => state.selectedChapter.id);
 
-  const onSubmit = async data => {
+  const onSubmit = async (data: any) => {
     try {
       // await dispatch(sponsorActions.submit(eventId, chapterId));
       setResponseMsg(`${data.name} has been added as a ${data.type} sponsor.`);

diff --git a/...components/Dashboard/Events/EventForm.tsx → ...rc/modules/dashboard/Events/EventForm.tsx b/...components/Dashboard/Events/EventForm.tsx → ...rc/modules/dashboard/Events/EventForm.tsx
@@ -14,8 +14,8 @@ import {
   IField,
   IEventFormData,
 } from './EventFormUtils';
-import { IEventModal } from 'client/store/types/events';
-import useFormStyles from '../shared/formStyles';
+import { IEventModal } from '../../Events/components/node_modules/client/store/types/events';
+import useFormStyles from '../shared/components/formStyles';
 
 const formatValue = (field: IField, store?: IEventModal): any => {
   const { key } = field;

diff --git a/...onents/Dashboard/Events/EventFormUtils.ts → ...odules/dashboard/Events/EventFormUtils.ts b/...onents/Dashboard/Events/EventFormUtils.ts → ...odules/dashboard/Events/EventFormUtils.ts
@@ -1,5 +1,5 @@
 import { IVenueModal } from 'client/store/types/venues';
-import { IEventModal } from 'client/store/types/events';
+import { IEventModal } from '../../Events/components/node_modules/client/store/types/events';
 
 export interface IField {
   key: string;

diff --git a/...components/Dashboard/Events/EventItem.tsx → ...rc/modules/dashboard/Events/EventItem.tsx b/...components/Dashboard/Events/EventItem.tsx → ...rc/modules/dashboard/Events/EventItem.tsx
@@ -2,10 +2,10 @@ import React from 'react';
 import { Card, Typography } from '@material-ui/core';
 import Link from 'next/link';
 
-import { IEventModal } from 'client/store/types/events';
+import { IEventModal } from '../../Events/components/node_modules/client/store/types/events';
 import { ProgressCardContent } from 'client/components';
-import Tags from './components/Tag';
-import Actions from './components/Actions';
+import Tags from '../../Events/components/Tag';
+import Actions from '../../Events/components/Actions';
 
 interface IEventItemProps {
   event: IEventModal;

diff --git a/.../components/Dashboard/Events/Skeleton.tsx → ...src/modules/dashboard/Events/Skeleton.tsx b/.../components/Dashboard/Events/Skeleton.tsx → ...src/modules/dashboard/Events/Skeleton.tsx
diff --git a/...s/Dashboard/Events/components/Actions.tsx → ...s/dashboard/Events/components/Actions.tsx b/...s/Dashboard/Events/components/Actions.tsx → ...s/dashboard/Events/components/Actions.tsx
diff --git a/...nents/Dashboard/Events/components/Tag.tsx → ...dules/dashboard/Events/components/Tag.tsx b/...nents/Dashboard/Events/components/Tag.tsx → ...dules/dashboard/Events/components/Tag.tsx
diff --git a/client/components/Dashboard/Events/index.ts → client/src/modules/dashboard/Events/index.ts b/client/components/Dashboard/Events/index.ts → client/src/modules/dashboard/Events/index.ts
diff --git a/client/src/modules/dashboard/Home/index.ts b/client/src/modules/dashboard/Home/index.ts
diff --git a/...ents/Dashboard/Locations/LocationForm.tsx → ...ules/dashboard/Locations/LocationForm.tsx b/...ents/Dashboard/Locations/LocationForm.tsx → ...ules/dashboard/Locations/LocationForm.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { useForm, Controller } from 'react-hook-form';
 import { Button, TextField, FormControl } from '@material-ui/core';
-import useFormStyles from '../shared/formStyles';
+import useFormStyles from '../shared/components/formStyles';
 
 const fields = ['country_code', 'city', 'region', 'postal_code', 'address'];
 

diff --git a/...ents/Dashboard/Locations/LocationItem.tsx → ...ules/dashboard/Locations/LocationItem.tsx b/...ents/Dashboard/Locations/LocationItem.tsx → ...ules/dashboard/Locations/LocationItem.tsx
diff --git a/...mponents/Dashboard/Locations/Skeleton.tsx → .../modules/dashboard/Locations/Skeleton.tsx b/...mponents/Dashboard/Locations/Skeleton.tsx → .../modules/dashboard/Locations/Skeleton.tsx
diff --git a/...t/components/Dashboard/Locations/index.ts → .../src/modules/dashboard/Locations/index.ts b/...t/components/Dashboard/Locations/index.ts → .../src/modules/dashboard/Locations/index.ts
diff --git a/.../components/Dashboard/Venues/Skeleton.tsx → ...src/modules/dashboard/Venues/Skeleton.tsx b/.../components/Dashboard/Venues/Skeleton.tsx → ...src/modules/dashboard/Venues/Skeleton.tsx
diff --git a/...components/Dashboard/Venues/VenueForm.tsx → ...rc/modules/dashboard/Venues/VenueForm.tsx b/...components/Dashboard/Venues/VenueForm.tsx → ...rc/modules/dashboard/Venues/VenueForm.tsx
@@ -12,7 +12,7 @@ import {
 import { ILocationModal } from 'client/store/types/locations';
 import getLocationString from 'client/helpers/getLocationString';
 import { IVenueModal } from 'client/store/types/venues';
-import useFormStyles from '../shared/formStyles';
+import useFormStyles from '../shared/components/formStyles';
 
 interface IData {
   name: string;

diff --git a/...components/Dashboard/Venues/VenueItem.tsx → ...rc/modules/dashboard/Venues/VenueItem.tsx b/...components/Dashboard/Venues/VenueItem.tsx → ...rc/modules/dashboard/Venues/VenueItem.tsx
diff --git a/client/components/Dashboard/Venues/index.ts → client/src/modules/dashboard/Venues/index.ts b/client/components/Dashboard/Venues/index.ts → client/src/modules/dashboard/Venues/index.ts
diff --git a/...nt/components/Dashboard/shared/Layout.tsx → ...es/dashboard/shared/components/Layout.tsx b/...nt/components/Dashboard/shared/Layout.tsx → ...es/dashboard/shared/components/Layout.tsx
diff --git a/...nt/components/Dashboard/shared/Navbar.tsx → ...es/dashboard/shared/components/Navbar.tsx b/...nt/components/Dashboard/shared/Navbar.tsx → ...es/dashboard/shared/components/Navbar.tsx
@@ -1,9 +1,9 @@
 import React from 'react';
 import Link from 'next/link';
-
-import links from 'client/constants/DashboardLinks';
 import { makeStyles } from '@material-ui/core';
 
+import links from '../../../../constants/DashboardLinks';
+
 const useStyles = makeStyles(() => ({
   link: {
     fontSize: '1rem',

diff --git a/...components/Dashboard/shared/formStyles.ts → ...dashboard/shared/components/formStyles.ts b/...components/Dashboard/shared/formStyles.ts → ...dashboard/shared/components/formStyles.ts
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		/// <reference types="next" />
		/// <reference types="next/types/global" />