enable react/prop-types rule

.eslintrc.js

@@ -10,7 +10,6 @@ module.exports = {
     "no-param-reassign": "warn",
     "import/prefer-default-export": "off",
     "import/no-cycle": "warn",
-    "react/prop-types": "warn",
     "react/jsx-props-no-spreading": "off", // some Mantine components need to use spread operator
     "react-hooks/exhaustive-deps": "off", // at this stage it is too risky to enable this
     "react/require-default-props": "warn",

src/components/react-pig/components/GroupHeader/GroupHeader.jsx

@@ -1,8 +1,9 @@
+import PropTypes from "prop-types";
 import React from "react";
 
 import styles from "./styles.module.css";
 
-export default function ({ settings, group, activeTileUrl }) {
+function GroupHeader({ settings, group, activeTileUrl }) {
   return (
     <header
       className={styles.headerPositioner}
@@ -24,3 +25,21 @@ export default function ({ settings, group, activeTileUrl }) {
     </header>
   );
 }
+
+GroupHeader.propTypes = {
+  settings: PropTypes.shape({
+    gridGap: PropTypes.number,
+    bgColor: PropTypes.string,
+    thumbnailSize: PropTypes.number,
+    expandedSize: PropTypes.number,
+  }).isRequired,
+  group: PropTypes.shape({
+    groupTranslateY: PropTypes.number,
+    height: PropTypes.number,
+    location: PropTypes.string,
+    date: PropTypes.string,
+  }).isRequired,
+  activeTileUrl: PropTypes.string.isRequired,
+};
+
+export default GroupHeader;

src/components/react-pig/components/Tile/Tile.jsx

@@ -1,3 +1,4 @@
+import PropTypes from "prop-types";
 import React, { useState } from "react";
 import { animated, useSpring } from "react-spring";
 
@@ -181,4 +182,43 @@ const Tile = React.memo(
   }
 );
 
+const ItemType = PropTypes.shape({
+  id: PropTypes.string,
+  dominantColor: PropTypes.string,
+  isTemp: PropTypes.bool,
+  url: PropTypes.string,
+  type: PropTypes.string,
+  style: PropTypes.shape({
+    height: PropTypes.number,
+    width: PropTypes.number,
+    translateX: PropTypes.number,
+    translateY: PropTypes.number,
+  }),
+});
+
+const SettingsType = PropTypes.shape({
+  gridGap: PropTypes.number,
+  bgColor: PropTypes.string,
+  thumbnailSize: PropTypes.number,
+  expandedSize: PropTypes.number,
+});
+
+Tile.propTypes = {
+  item: ItemType.isRequired,
+  useLqip: PropTypes.bool.isRequired,
+  containerWidth: PropTypes.number.isRequired,
+  containerOffsetTop: PropTypes.number.isRequired,
+  getUrl: PropTypes.func.isRequired,
+  activeTileUrl: PropTypes.string.isRequired,
+  handleClick: PropTypes.func.isRequired,
+  handleSelection: PropTypes.func.isRequired,
+  selected: PropTypes.bool.isRequired,
+  selectable: PropTypes.bool.isRequired,
+  windowHeight: PropTypes.number.isRequired,
+  scrollSpeed: PropTypes.string.isRequired,
+  settings: SettingsType.isRequired,
+  toprightoverlay: PropTypes.func,
+  bottomleftoverlay: PropTypes.func,
+};
+
 export default Tile;

src/components/react-pig/index.jsx

@@ -303,11 +303,23 @@ Pig.defaultProps = {
   groupGapLg: 50,
   gridGap: 8,
   bgColor: "#fff",
+  getUrl: null,
+  sortByDate: false,
+  sortFunc: null,
+  handleClick: null,
+  selectable: false,
+  handleSelection: null,
+  numberOfItems: null,
+  scaleOfImages: null,
+  updateGroups: null,
+  updateItems: null,
+  selectedItems: null,
+  toprightoverlay: null,
+  bottomleftoverlay: null,
 };
 
 Pig.propTypes = {
-  // eslint-disable-next-line react/forbid-prop-types
-  imageData: PropTypes.array.isRequired,
+  imageData: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
   useLqip: PropTypes.bool,
   gridGap: PropTypes.number,
   getUrl: PropTypes.func,
@@ -322,4 +334,14 @@ Pig.propTypes = {
   expandedSize: PropTypes.number,
   thumbnailSize: PropTypes.number,
   bgColor: PropTypes.string,
+  handleClick: PropTypes.func,
+  selectable: PropTypes.bool,
+  handleSelection: PropTypes.func,
+  numberOfItems: PropTypes.number,
+  scaleOfImages: PropTypes.number,
+  updateGroups: PropTypes.func,
+  updateItems: PropTypes.func,
+  selectedItems: PropTypes.arrayOf(PropTypes.shape({})),
+  toprightoverlay: PropTypes.shape({}),
+  bottomleftoverlay: PropTypes.shape({}),
 };