Add require jsdoc rule (#73)

Author: yaacov

.eslintrc.json

@@ -17,7 +17,7 @@
     "ecmaVersion": 12,
     "sourceType": "module"
   },
-  "plugins": ["react", "@typescript-eslint", "react-hooks", "prettier", "simple-import-sort"],
+  "plugins": ["react", "@typescript-eslint", "react-hooks", "prettier", "simple-import-sort", "jsdoc"],
   "settings": {
     "react": {
       "version": "latest"
@@ -40,6 +40,15 @@
     ],
     "simple-import-sort/exports": "error",
     "@typescript-eslint/no-shadow": ["error"],
+    "jsdoc/require-jsdoc": 1, // Recommended
+    "jsdoc/require-param": 1, // Recommended
+    "jsdoc/require-param-description": 1, // Recommended
+    "jsdoc/require-param-name": 1, // Recommended
+    "jsdoc/require-param-type": 1, // Recommended
+    "jsdoc/require-property": 1, // Recommended
+    "jsdoc/require-property-description": 1, // Recommended
+    "jsdoc/require-property-name": 1, // Recommended
+    "jsdoc/require-property-type": 1, // Recommended
     "simple-import-sort/imports": [
       "warn",
       {

package.json

@@ -59,6 +59,7 @@
     "eslint-config-prettier": "^8.3.0",
     "eslint-import-resolver-typescript": "^2.5.0",
     "eslint-plugin-import": "^2.25.4",
+    "eslint-plugin-jsdoc": "^37.9.4",
     "eslint-plugin-prettier": "^4.0.0",
     "eslint-plugin-react": "^7.28.0",
     "eslint-plugin-react-hooks": "^4.3.0",
@@ -70,7 +71,7 @@
     "prettier": "^2.5.1",
     "raw-loader": "^4.0.2",
     "react-docgen-typescript": "^2.2.2",
-    "react-styleguidist": "^11.2.0",
+    "react-styleguidist": "^5.5.10",
     "rollup": "^2.63.0",
     "rollup-plugin-dts": "^4.1.0",
     "rollup-plugin-postcss": "^4.0.2",

src/components/icons/OSIcon/OSIcon.tsx

@@ -90,6 +90,14 @@ export type OSIconProps = {
  * The OSIconsEnum is exported with the OSIcon and it represent the possible icons available with this component.
  *
  * OSIcon use a standard HTML img tag to render the right os image for you.
+ *
+ * @param {OSIconProps} props is the parrent props object.
+ * @param {string} props.iconClass is the name of the OS class.
+ * @param {string} props.alt is the alt attribute holds a text description of the os icon image.
+ * @param {string} props.className is additional classes added to the image.
+ * @param {string} props.width is the intrinsic width of the image. Could be a string or a number of pixels.
+ * @param {string} props.height is the intrinsic height of the image. Could be a string or a number of pixels.
+ * @param {string} props.'data-test-id' is a testing id.
  * */
 export const OSIcon = ({
   iconClass,

src/components/utils/ConditionLabel/ConditionLabel.tsx

@@ -21,11 +21,21 @@ export interface k8sStatusConditions {
   message?: string;
 }
 
+export type ConditionLabelProps = {
+  message?: string;
+  status: string;
+  reason: string;
+};
+
 /**
  * ConditionLabel renders a k8sStatusConditions.
  * Usefull to give information of what the resouce is doing without taking up much space into the interface.
  *
  * On mouse click it creates a popover to explain the state in a more disursive way.
+ * @param {ConditionLabelProps} props is the parrent props object.
+ * @param {string} props.message popup message to print when clicking the condition.
+ * @param {string} props.status the status of the condition.
+ * @param {string} props.reason the condition id.
  */
 export const ConditionLabel: React.FC<k8sStatusConditions> = ({ message, status, reason }) => {
   const preventLabelLink = React.useCallback((e) => e.preventDefault(), []);