refactor: refactoring md files

openedx · Dec 19, 2023 · 6770b2a · 6770b2a
1 parent d09a1ab
commit 6770b2a
Show file tree

Hide file tree

Showing 110 changed files with 4,744 additions and 4,755 deletions.
diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
@@ -8,16 +8,16 @@ Include a direct link to your changes in this PR's deploy preview here (e.g., a
 
 ## Merge Checklist
 
-* [ ] If your update includes visual changes, have they been reviewed by a designer? Send them a link to the Netlify deploy preview, if applicable.
-* [ ] Does your change adhere to the documented [style conventions](https://github.com/openedx/paragon/blob/master/docs/decisions/0012-css-styling-conventions)?
-* [ ] Do any prop types have missing descriptions in the Props API tables in the documentation site (check deploy preview)?
-* [ ] Were your changes tested using all available themes (see theme switcher in the header of the deploy preview, under the "Settings" icon)?
-* [ ] Were your changes tested in the `example` app?
-* [ ] Is there adequate test coverage for your changes?
-* [ ] Consider whether this change needs to reviewed/QA'ed for accessibility (a11y). If so, please add `wittjeff` and `adamstankiewicz` as reviewers on this PR.
+- [ ] If your update includes visual changes, have they been reviewed by a designer? Send them a link to the Netlify deploy preview, if applicable.
+- [ ] Does your change adhere to the documented [style conventions](https://github.com/openedx/paragon/blob/master/docs/decisions/0012-css-styling-conventions)?
+- [ ] Do any prop types have missing descriptions in the Props API tables in the documentation site (check deploy preview)?
+- [ ] Were your changes tested using all available themes (see theme switcher in the header of the deploy preview, under the "Settings" icon)?
+- [ ] Were your changes tested in the `example` app?
+- [ ] Is there adequate test coverage for your changes?
+- [ ] Consider whether this change needs to reviewed/QA'ed for accessibility (a11y). If so, please add `wittjeff` and `adamstankiewicz` as reviewers on this PR.
 
 ## Post-merge Checklist
 
-* [ ] Verify your changes were released to [NPM](https://www.npmjs.com/package/@edx/paragon) at the expected version.
-* [ ] If you'd like, [share](https://github.com/openedx/paragon/discussions/new?category=show-and-tell) your contribution in [#show-and-tell](https://github.com/openedx/paragon/discussions/categories/show-and-tell).
-* [ ] 🎉 🙌 Celebrate! Thanks for your contribution.
+- [ ] Verify your changes were released to [NPM](https://www.npmjs.com/package/@edx/paragon) at the expected version.
+- [ ] If you'd like, [share](https://github.com/openedx/paragon/discussions/new?category=show-and-tell) your contribution in [#show-and-tell](https://github.com/openedx/paragon/discussions/categories/show-and-tell).
+- [ ] 🎉 🙌 Celebrate! Thanks for your contribution.
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,11 @@
+{
+  "overrides": [
+    {
+      "files": "*.{md,mdx}",
+      "options": {
+        "semi": true,
+        "singleQuote": true
+      }
+    }
+  ]
+}
diff --git a/CHANGELOG.md b/CHANGELOG.md
diff --git a/README.md b/README.md
diff --git a/component-generator/templates/README.md b/component-generator/templates/README.md
@@ -2,7 +2,7 @@
 title: 'componentName'
 type: 'component'
 components:
-- componentName
+  - componentName
 status: 'New'
 designStatus: 'Done'
 devStatus: 'Done'
@@ -15,7 +15,5 @@ Describe your component here and give usage examples.
 ### Basic Usage
 
 ```jsx live
-<componentName>
-  Hello!
-</componentName>
+<componentName>Hello!</componentName>
 ```
diff --git a/docs/decisions/0013-deprecating-font-awesome.md b/docs/decisions/0013-deprecating-font-awesome.md
@@ -2,15 +2,15 @@
 
 ## Context
 
-We've found that Font Awesome doesn't necessarily have icons for everything we need, and we also have found versions in other icon libraries that we like more.  Many (most?) of our micro-frontends currently use Font Awesome.
+We've found that Font Awesome doesn't necessarily have icons for everything we need, and we also have found versions in other icon libraries that we like more. Many (most?) of our micro-frontends currently use Font Awesome.
 
 ## Decision
 
-We're moving away from Font Awesome in favor of the icons in the paragon/icons subdirectory.  We gather the best free and open source icons that suit our purposes and form a cohesive visual look and feel.  There are [instructions on the wiki](https://openedx.atlassian.net/wiki/spaces/BPL/pages/2152661212/Iconography) for how to add a new icon.
+We're moving away from Font Awesome in favor of the icons in the paragon/icons subdirectory. We gather the best free and open source icons that suit our purposes and form a cohesive visual look and feel. There are [instructions on the wiki](https://openedx.atlassian.net/wiki/spaces/BPL/pages/2152661212/Iconography) for how to add a new icon.
 
 We should opportunistically remove font-awesome and cut over to Paragon icons wherever possible, which will simplify our dependency tree and CSS, while promoting a consistent look and feel.
 
 ## Links
 
-* See instructions here: [Iconography on the Wiki](https://openedx.atlassian.net/wiki/spaces/BPL/pages/2152661212/Iconography)
-* See README here: [paragon/icons README](https://github.com/openedx/paragon/tree/master/icons)
+- See instructions here: [Iconography on the Wiki](https://openedx.atlassian.net/wiki/spaces/BPL/pages/2152661212/Iconography)
+- See README here: [paragon/icons README](https://github.com/openedx/paragon/tree/master/icons)
diff --git a/icons/README.md b/icons/README.md
@@ -19,5 +19,6 @@ npm run build
 ```
 
 Note that most of the icons are taken from [MUI icons](https://github.com/material-icons/material-icons), this is achieved through `copy-mui-icons.js` script located in this directory which is part of `npm run build` command. There are a couple of things to keep in mind:
+
 - the script currently does not override existing files, so if you need updated version of the icon you will need to update it manually (copy the icon to `svg` directory and run build command)
 - if new version of the `material-icons` package is published with new icons, the version needs to be updated in `package.json` before running the build command to include new icons
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -47,7 +47,8 @@
     "build-types": "tsc --emitDeclarationOnly",
     "playroom:start": "npm run playroom:start --workspace=www",
     "playroom:build": "npm run playroom:build --workspace=www",
-    "prepare": "husky install"
+    "prepare": "husky install",
+    "format-mdx": "prettier --write \"**/*.md\" \"**/*.mdx\""
   },
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^6.1.1",
@@ -131,6 +132,7 @@
     "jest-environment-jsdom": "^28.1.2",
     "lint-staged": "^15.2.0",
     "markdown-loader-jest": "^0.1.1",
+    "prettier": "3.1.1",
     "react": "^17.0.0",
     "react-dom": "^17.0.0",
     "react-test-renderer": "^17.0.0",
@@ -183,8 +185,15 @@
     "extends @edx/browserslist-config"
   ],
   "lint-staged": {
-    "*.{js,jsx,ts,tsx}": ["npx eslint"],
-    "*.scss": ["npx stylelint"]
+    "*.{js,jsx,ts,tsx}": [
+      "npx eslint"
+    ],
+    "*.scss": [
+      "npx stylelint"
+    ],
+    "*.{md,mdx}": [
+      "npm run format-mdx"
+    ]
   },
   "workspaces": [
     "example",

diff --git a/src/ActionRow/README.md b/src/ActionRow/README.md
@@ -2,15 +2,14 @@
 title: 'ActionRow'
 type: 'component'
 components:
-- ActionRow
-- ActionRowSpacer
+  - ActionRow
+  - ActionRowSpacer
 categories:
-- Buttonlike
+  - Buttonlike
 status: 'Stable'
 designStatus: 'Done'
 devStatus: 'Done'
 notes: |
-
 ---
 
 A layout utility for the common use case of aligning buttons, links or text
@@ -22,31 +21,23 @@ ActionRow assumes that its last child is the primary action and lays out actions
 
 ```jsx live
 <ActionRow>
-  <Button variant="tertiary">
-    Cancel
-  </Button>
-  <Button variant="primary">
-    Submit
-  </Button>
+  <Button variant="tertiary">Cancel</Button>
+  <Button variant="primary">Submit</Button>
 </ActionRow>
 ```
 
 ## Usage with a Spacer
 
-ActionRow can also be used with a helper component ``ActionRow.Spacer`` to insert empty space between children
+ActionRow can also be used with a helper component `ActionRow.Spacer` to insert empty space between children
 
 ```jsx live
 <ActionRow>
   <Form.Checkbox className="flex-column flex-sm-row">
-      Don't ask me again.
+    Don't ask me again.
   </Form.Checkbox>
   <ActionRow.Spacer />
-  <Button variant="tertiary">
-    Cancel
-  </Button>
-  <Button variant="primary">
-    Submit
-  </Button>
+  <Button variant="tertiary">Cancel</Button>
+  <Button variant="primary">Submit</Button>
 </ActionRow>
 ```
 
@@ -55,13 +46,10 @@ ActionRow can also be used with a helper component ``ActionRow.Spacer`` to inser
 ```jsx live
 <ActionRow isStacked>
   <p className="x-small">
-    Bespoke leggings yuccie, portland umami readymade craft beer vaporware sriracha.
+    Bespoke leggings yuccie, portland umami readymade craft beer vaporware
+    sriracha.
   </p>
-  <Button variant="tertiary">
-    Go back
-  </Button>
-  <Button variant="primary">
-    Continue
-  </Button>
+  <Button variant="tertiary">Go back</Button>
+  <Button variant="primary">Continue</Button>
 </ActionRow>
 ```