fix: build bug,prop types, etc

.husky/pre-push

@@ -1,4 +1,4 @@
 #!/usr/bin/env sh
 . "$(dirname -- "$0")/_/husky.sh"
 
-#yarn build
+yarn build

components/cards/data-card/DataCard.jsx

@@ -1,4 +1,5 @@
 import { Divider, Paper, Typography } from '@mui/material';
+import PropType from 'prop-types';
 
 const DataCard = ({ data, t }) => {
   return (
@@ -16,4 +17,13 @@ const DataCard = ({ data, t }) => {
   );
 };
 
+DataCard.propTypes = {
+  data: PropType.shape({
+    name: PropType.string,
+    age: PropType.number,
+    gender: PropType.string,
+  }),
+  t: PropType.func,
+};
+
 export default DataCard;

components/cards/data-details-card/DataDetailsCard.jsx

@@ -2,6 +2,7 @@ import Card from '@mui/material/Card';
 import CardContent from '@mui/material/CardContent';
 import Typography from '@mui/material/Typography';
 import Image from 'next/image';
+import PropType from 'prop-types';
 
 const DataDetailsCard = ({ data }) => {
   return (
@@ -44,4 +45,11 @@ const DataDetailsCard = ({ data }) => {
   );
 };
 
+DataDetailsCard.propTypes = {
+  data: PropType.shape({
+    name: PropType.string,
+    gender: PropType.string,
+  }),
+};
+
 export default DataDetailsCard;

components/cards/hover-image-card/HoverImageCard.mock.js

@@ -0,0 +1,5 @@
+const base = {};
+
+export const mockHoverImageCardProps = {
+  base,
+};

components/cards/hover-image-card/HoverImageCard.stories.jsx

@@ -0,0 +1,20 @@
+import HoverImageCard from './HoverImageCard';
+import { mockHoverImageCardProps } from './ProfileCard.mock';
+
+const obj = {
+  title: 'cards/HoverImageCard',
+  component: HoverImageCard,
+  // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
+  argTypes: {},
+}; //eslint-disable-line
+
+export default obj;
+// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
+const Template = (args) => <HoverImageCard {...args} />;
+
+export const Base = Template.bind({});
+// More on args: https://storybook.js.org/docs/react/writing-stories/args
+
+Base.args = {
+  ...mockHoverImageCardProps.base,
+};

components/cards/profile-card/ProfileCard.jsx

@@ -2,6 +2,7 @@ import Card from '@mui/material/Card';
 import CardContent from '@mui/material/CardContent';
 import Typography from '@mui/material/Typography';
 import Image from 'next/image';
+import PropType from 'prop-types';
 
 const ProfileCard = ({ profileData }) => {
   return (
@@ -26,4 +27,10 @@ const ProfileCard = ({ profileData }) => {
   );
 };
 
+ProfileCard.propTypes = {
+  profileData: PropType.shape({
+    name: PropType.string,
+  }),
+};
+
 export default ProfileCard;

components/forms/contact/ContactForm.mcok.js

@@ -0,0 +1,5 @@
+const base = {};
+
+export const mockContactFormProps = {
+  base,
+};

components/forms/contact/ContactForm.stories.jsx

@@ -0,0 +1,20 @@
+import ContactForm from './ContactForm';
+import { mockContactFormProps } from './ContactForm.mock';
+
+const obj = {
+  title: 'forms/ContactForm',
+  component: ContactForm,
+  // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
+  argTypes: {},
+}; //eslint-disable-line
+
+export default obj;
+// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
+const Template = (args) => <ContactForm {...args} />;
+
+export const Base = Template.bind({});
+// More on args: https://storybook.js.org/docs/react/writing-stories/args
+
+Base.args = {
+  ...mockContactFormProps.base,
+};

components/pagination/filter-sort/FilterSortComponent.jsx

@@ -5,6 +5,7 @@ import {
   Select,
   TextField,
 } from '@mui/material';
+import PropType from 'prop-types';
 
 const FilterSortComponent = ({
   sort,
@@ -39,4 +40,11 @@ const FilterSortComponent = ({
   );
 };
 
+FilterSortComponent.propTypes = {
+  sort: PropType.string,
+  handleSortChange: PropType.func,
+  filter: PropType.string,
+  handleFilterChange: PropType.func,
+};
+
 export default FilterSortComponent;

components/sass-components/InputFields/Search.js

@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 
 import BaseInputField from './BaseInputField';
 
@@ -14,7 +14,7 @@ const Search = ({
 }) => (
   <BaseInputField
     type="text"
-    label=""
+    label={label}
     placeholder={placeholder}
     disabled={disabled}
     form={form}

pages/api/single-data/[dataId].js

@@ -13,7 +13,6 @@ async function handler(req, res) {
 
         const person = await Person.findOne({ customID: dataId });
 
-        console.log(person);
         if (!person) {
           throw new Error('Person with this id does not exist!');
         }

pages/contact.js → pages/contact/index.js

@@ -1,5 +1,5 @@
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
-import ContactForm from '../components/forms/contact/ContactForm';
+import ContactForm from '../../components/forms/contact/ContactForm';
 
 const ContactPage = () => {
   return <ContactForm />;

pages/index.js

@@ -1,7 +1,7 @@
 import { dehydrate, QueryClient } from '@tanstack/react-query';
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
 import Head from 'next/head';
-import HoverImageCard from '../components/cards/hover-image-card/hover-image-card';
+import HoverImageCard from '../components/cards/hover-image-card/HoverImageCard';
 import PaginationComponentRQ from '../components/pagination/react-query/PaginationComponentRQ';
 import { getData } from '../requests/dataRequest';
 

pages/single-data/[dataId].js

@@ -5,7 +5,6 @@ import { getSingleData } from '../../requests/singleDataRequest';
 const SignelDataPage = (props) => {
   const data = props.selectedData;
 
-  console.log(data);
   if (!data) {
     return <h1>{props.message}</h1>;
   }
@@ -35,18 +34,22 @@ export async function getStaticProps(context) {
 }
 
 export async function getStaticPaths() {
-  const firstPageDataIds = await getDataIds();
-
-  console.log(firstPageDataIds);
-  const paths = firstPageDataIds.dataIds.map((id) => ({
-    params: { dataId: id },
-  }));
+  try {
+    const firstPageDataIds = await getDataIds();
+    const paths = firstPageDataIds.dataIds.map((id) => ({
+      params: { dataId: id },
+    }));
 
-  console.log(paths);
-  return {
-    paths: paths,
-    fallback: 'blocking',
-  };
+    return {
+      paths: paths,
+      fallback: 'blocking',
+    };
+  } catch (error) {
+    return {
+      paths: [],
+      fallback: 'blocking',
+    };
+  }
 }
 
 export default SignelDataPage;