Setup commons-ui-payload

apps/climatemappedafrica/package.json

@@ -36,6 +36,7 @@
     "@apollo/client": "catalog:",
     "@commons-ui/core": "catalog:",
     "@commons-ui/next": "workspace:*",
+    "@commons-ui/payload": "workspace:*",
     "@emotion/react": "catalog:",
     "@emotion/styled": "catalog:",
     "@hurumap/core": "workspace:*",

apps/climatemappedafrica/src/components/Footer/index.js

@@ -1,5 +1,6 @@
 import { QuickLinks, LogoButton, Copyright } from "@commons-ui/core";
-import { Link, RichText, StayInTouch } from "@commons-ui/next";
+import { Link, StayInTouch } from "@commons-ui/next";
+import { RichText } from "@commons-ui/payload";
 import { Grid } from "@mui/material";
 import React from "react";
 

packages/commons-ui-next/src/index.js

@@ -4,5 +4,4 @@ export { default as Link } from "./Link";
 export * from "./Link";
 
 export { default as RichTypography } from "./RichTypography";
-export { default as RichText } from "./RichText";
 export { default as StayInTouch } from "./StayInTouch";

packages/commons-ui-payload/.eslintignore

@@ -0,0 +1,29 @@
+# dependencies
+node_modules
+.pnp
+.pnp.js
+.pnpm-debug.log
+
+# testing
+coverage
+
+# next.js
+.next/
+out/
+build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Vercel
+.vercel
+.now
+
+# turbo
+.turbo

packages/commons-ui-payload/.eslintrc.js

@@ -0,0 +1,4 @@
+module.exports = {
+  root: true,
+  extends: ["eslint-config-commons-ui"],
+};

packages/commons-ui-payload/.lintstagedrc.js

@@ -0,0 +1 @@
+module.exports = require("eslint-config-commons-ui/.lintstagedrc");

packages/commons-ui-payload/jest.config.js

@@ -0,0 +1,14 @@
+const defaultConfig = require("jest-config-commons-ui");
+
+const { moduleNameMapper } = defaultConfig;
+
+module.exports = {
+  ...defaultConfig,
+  moduleNameMapper: {
+    ...moduleNameMapper,
+    // Handle module aliases
+    "^@/commons-ui/core/(.*)$": "<rootDir>/../commons-ui-core/src/$1",
+    "^@/commons-ui/next/(.*)$": "<rootDir>/../commons-ui-next/src/$1",
+    "^@/commons-ui/payload/(.*)$": "<rootDir>/src/$1",
+  },
+};

packages/commons-ui-payload/jest.setup.js

@@ -0,0 +1,12 @@
+/* eslint-env jest */
+
+jest.mock("next/router", () => ({
+  useRouter: jest.fn().mockImplementation(() => ({
+    asPath: "",
+    isReady: true,
+    push: jest.fn(),
+    query: {},
+  })),
+}));
+
+module.exports = require("@commons-ui/testing-library/jest.setup");

packages/commons-ui-payload/jsconfig.json

@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/commons-ui/payload/*": ["./src/*"]
+    }
+  },
+  "exclude": ["node_modules"]
+}

packages/commons-ui-payload/package.json

@@ -0,0 +1,66 @@
+{
+  "name": "@commons-ui/payload",
+  "version": "0.0.1",
+  "private": false,
+  "author": "Code for Africa <tech@codeforafrica.org>",
+  "description": "",
+  "main": "src/index.js",
+  "keywords": [
+    "react",
+    "react-component",
+    "mui",
+    "material-ui",
+    "material design"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/codeforafrica/ui.git",
+    "directory": "packages/commons-ui-core"
+  },
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/codeforafrica/ui/issues"
+  },
+  "scripts": {
+    "jest": "jest",
+    "lint-check": "TIMING=1 eslint './'",
+    "lint": "TIMING=1 eslint --fix './'",
+    "clean": "rm -rf .turbo node_modules dist"
+  },
+  "devDependencies": {
+    "@babel/core": "catalog:",
+    "@babel/preset-react": "catalog:",
+    "@commons-ui/testing-library": "workspace:*",
+    "@emotion/react": "catalog:",
+    "@emotion/styled": "catalog:",
+    "@mui/material": "catalog:",
+    "@mui/utils": "catalog:",
+    "@types/react": "catalog:",
+    "babel-loader": "catalog:",
+    "eslint": "catalog:",
+    "eslint-config-commons-ui": "workspace:*",
+    "identity-obj-proxy": "catalog:",
+    "jest": "catalog:",
+    "jest-config-commons-ui": "workspace:*",
+    "prettier": "catalog:",
+    "react": "catalog:",
+    "react-dom": "catalog:",
+    "react-test-renderer": "catalog:",
+    "require-from-string": "catalog:",
+    "typescript": "catalog:",
+    "webpack": "catalog:"
+  },
+  "peerDependencies": {
+    "@babel/core": "catalog:",
+    "@commons-ui/core": "workspace:*",
+    "@commons-ui/next": "workspace:*",
+    "@mui/material": "catalog:",
+    "clsx": "catalog:",
+    "next": "catalog:",
+    "prop-types": "catalog:",
+    "react": "catalog:",
+    "react-dom": "catalog:",
+    "slate": "catalog:"
+  },
+  "dependencies": {}
+}

packages/commons-ui-next/src/RichText/RichText.js → packages/commons-ui-payload/src/RichText/RichText.js

@@ -1,11 +1,9 @@
 /* eslint-disable react/no-array-index-key */
+import { Link, RichTypography } from "@commons-ui/next";
 import { Box } from "@mui/material";
 import React, { Fragment } from "react";
 import { Text } from "slate";
 
-import Link from "@/commons-ui/next/Link";
-import RichTypography from "@/commons-ui/next/RichTypography";
-
 const DEFAULT_PROPS = {
   html: false,
 };

packages/commons-ui-payload/src/index.js

@@ -0,0 +1,3 @@
+/* eslint-disable import/prefer-default-export */
+
+export { default as RichText } from "./RichText";