From db1d2cbf6bad6ecd3413e73d33d6ee400e5b8ade Mon Sep 17 00:00:00 2001 From: Yassine Date: Mon, 6 Mar 2023 11:23:34 -0500 Subject: [PATCH] feat: improve custom component search page (#1112) ## Proposed changes * Enhanced results templates * Updated facets * Dedicated pipeline with featured results ### Before ![image](https://user-images.githubusercontent.com/12199712/220170436-8e938623-1711-4cb6-a484-e775991d46b4.png) ### After ![image](https://user-images.githubusercontent.com/12199712/220170018-b3d8cc6a-ee3f-4396-9fe1-7f0d4eeea48c.png) ## Testing - [ ] Unit Tests: - [ ] Functionnal Tests: - [ ] Manual Tests: --------- Co-authored-by: Louis Bompart --- .../template/src/pages/index.css | 4 + .../template/src/pages/index.html | 307 ++++++++++++++++-- .../tests/__snapshots__/test.spec.ts.snap | 10 +- .../tests/__snapshots__/test.spec.ts.snap | 40 +-- .../tests/__snapshots__/test.spec.ts.snap | 40 +-- packages/ui/atomic/tempdoc/README.md | 8 +- 6 files changed, 327 insertions(+), 82 deletions(-) diff --git a/packages/ui/atomic/create-atomic-component-project/template/src/pages/index.css b/packages/ui/atomic/create-atomic-component-project/template/src/pages/index.css index 01184e128c..bcd11a3bcb 100644 --- a/packages/ui/atomic/create-atomic-component-project/template/src/pages/index.css +++ b/packages/ui/atomic/create-atomic-component-project/template/src/pages/index.css @@ -1,3 +1,7 @@ +:root { + --atomic-font-family: Lexend; + --atomic-font-normal: 300; +} body { margin: 0; } diff --git a/packages/ui/atomic/create-atomic-component-project/template/src/pages/index.html b/packages/ui/atomic/create-atomic-component-project/template/src/pages/index.html index 096063068e..e260b8382e 100644 --- a/packages/ui/atomic/create-atomic-component-project/template/src/pages/index.html +++ b/packages/ui/atomic/create-atomic-component-project/template/src/pages/index.html @@ -5,28 +5,42 @@ Test-2121 - + - - + - - + + + + + + @@ -47,12 +61,13 @@ - - + + + + + + - + + + + + + + + + diff --git a/packages/ui/atomic/create-atomic-component-project/tests/__snapshots__/test.spec.ts.snap b/packages/ui/atomic/create-atomic-component-project/tests/__snapshots__/test.spec.ts.snap index bba0473d36..cd3046fc7f 100644 --- a/packages/ui/atomic/create-atomic-component-project/tests/__snapshots__/test.spec.ts.snap +++ b/packages/ui/atomic/create-atomic-component-project/tests/__snapshots__/test.spec.ts.snap @@ -20,11 +20,11 @@ HashedFolder { HashedFolder { "children": [ HashedFile { - "hash": "wRrWASx36kB/WHP3xotlHQbcLdo=", + "hash": "L08E7dMK5e0wD5P8meKHfkDDa3o=", "name": "index.css", }, HashedFile { - "hash": "PzWUKvDClNOd5HSK8c6YTFV8/9Q=", + "hash": "2XR/MKCv0fo3uRpZRiTyOBoHk7s=", "name": "index.html", }, HashedFile { @@ -32,11 +32,11 @@ HashedFolder { "name": "index.ts", }, ], - "hash": "KaLKYWk10KFfD5NR/eQK0Zlk4qc=", + "hash": "V7y/8CwkVmHHCoFc1OqeZ9uA7Uo=", "name": "pages", }, ], - "hash": "k4Tz5Ow35z6eAe5vRRIeg5Q7EQM=", + "hash": "H2FkraODOnXLneM0nLxX/jx8A+g=", "name": "src", }, HashedFile { @@ -48,7 +48,7 @@ HashedFolder { "name": "tsconfig.json", }, ], - "hash": "OHBciH9SThvPSnDxVPfuXsAO43g=", + "hash": "0X8iVzkXeAggi7wkOPzz5dYFx1w=", "name": "testDirectory", } `; diff --git a/packages/ui/atomic/create-atomic-component/tests/__snapshots__/test.spec.ts.snap b/packages/ui/atomic/create-atomic-component/tests/__snapshots__/test.spec.ts.snap index 6ed67eac32..61301be8bc 100644 --- a/packages/ui/atomic/create-atomic-component/tests/__snapshots__/test.spec.ts.snap +++ b/packages/ui/atomic/create-atomic-component/tests/__snapshots__/test.spec.ts.snap @@ -96,11 +96,11 @@ HashedFolder { HashedFolder { "children": [ HashedFile { - "hash": "wRrWASx36kB/WHP3xotlHQbcLdo=", + "hash": "L08E7dMK5e0wD5P8meKHfkDDa3o=", "name": "index.css", }, HashedFile { - "hash": "PzWUKvDClNOd5HSK8c6YTFV8/9Q=", + "hash": "2XR/MKCv0fo3uRpZRiTyOBoHk7s=", "name": "index.html", }, HashedFile { @@ -108,11 +108,11 @@ HashedFolder { "name": "index.ts", }, ], - "hash": "KaLKYWk10KFfD5NR/eQK0Zlk4qc=", + "hash": "V7y/8CwkVmHHCoFc1OqeZ9uA7Uo=", "name": "pages", }, ], - "hash": "8aOHQQDdN19cj4sJiofLrYoBiuQ=", + "hash": "oMyweo5ZoDGU8/9FxlKY4093a0k=", "name": "src", }, HashedFile { @@ -124,7 +124,7 @@ HashedFolder { "name": "tsconfig.json", }, ], - "hash": "Rgpf1cwORSDwoIzHwJBz28nMTks=", + "hash": "Y2dFF69/UtiwGwj+t/9UGbSxfMw=", "name": "no-args", } `; @@ -187,11 +187,11 @@ HashedFolder { HashedFolder { "children": [ HashedFile { - "hash": "wRrWASx36kB/WHP3xotlHQbcLdo=", + "hash": "L08E7dMK5e0wD5P8meKHfkDDa3o=", "name": "index.css", }, HashedFile { - "hash": "PzWUKvDClNOd5HSK8c6YTFV8/9Q=", + "hash": "2XR/MKCv0fo3uRpZRiTyOBoHk7s=", "name": "index.html", }, HashedFile { @@ -199,11 +199,11 @@ HashedFolder { "name": "index.ts", }, ], - "hash": "KaLKYWk10KFfD5NR/eQK0Zlk4qc=", + "hash": "V7y/8CwkVmHHCoFc1OqeZ9uA7Uo=", "name": "pages", }, ], - "hash": "mUJJaqUJ0CqtGlBDHM3zlmnxYuU=", + "hash": "PlNh8eoH7CDvnvtuhPijQRjdkPU=", "name": "src", }, HashedFile { @@ -215,7 +215,7 @@ HashedFolder { "name": "tsconfig.json", }, ], - "hash": "fsl59uAyXpQR/27PY012bVqVKJY=", + "hash": "kggJGg31rvTmUgg5S1yxTNbknd0=", "name": "invalid-arg", } `; @@ -278,11 +278,11 @@ HashedFolder { HashedFolder { "children": [ HashedFile { - "hash": "wRrWASx36kB/WHP3xotlHQbcLdo=", + "hash": "L08E7dMK5e0wD5P8meKHfkDDa3o=", "name": "index.css", }, HashedFile { - "hash": "PzWUKvDClNOd5HSK8c6YTFV8/9Q=", + "hash": "2XR/MKCv0fo3uRpZRiTyOBoHk7s=", "name": "index.html", }, HashedFile { @@ -290,11 +290,11 @@ HashedFolder { "name": "index.ts", }, ], - "hash": "KaLKYWk10KFfD5NR/eQK0Zlk4qc=", + "hash": "V7y/8CwkVmHHCoFc1OqeZ9uA7Uo=", "name": "pages", }, ], - "hash": "6C2bpCcXCqExoxgYM/+Pl4yem+M=", + "hash": "GjoPZh+oly8/+4E6acM8CPJl6YM=", "name": "src", }, HashedFile { @@ -306,7 +306,7 @@ HashedFolder { "name": "tsconfig.json", }, ], - "hash": "tiRHGPeM/DHkRl84edi1+CBaCSI=", + "hash": "L5oTe9YP2LBgE87kHbw33ClM1XU=", "name": "valid-arg", } `; @@ -369,11 +369,11 @@ HashedFolder { HashedFolder { "children": [ HashedFile { - "hash": "wRrWASx36kB/WHP3xotlHQbcLdo=", + "hash": "L08E7dMK5e0wD5P8meKHfkDDa3o=", "name": "index.css", }, HashedFile { - "hash": "PzWUKvDClNOd5HSK8c6YTFV8/9Q=", + "hash": "2XR/MKCv0fo3uRpZRiTyOBoHk7s=", "name": "index.html", }, HashedFile { @@ -381,11 +381,11 @@ HashedFolder { "name": "index.ts", }, ], - "hash": "KaLKYWk10KFfD5NR/eQK0Zlk4qc=", + "hash": "V7y/8CwkVmHHCoFc1OqeZ9uA7Uo=", "name": "pages", }, ], - "hash": "mA+dme8V0kWh05kGlUW7qeownS4=", + "hash": "jBounrszm6RC8jqTeoO03kowFUo=", "name": "src", }, HashedFile { @@ -397,7 +397,7 @@ HashedFolder { "name": "tsconfig.json", }, ], - "hash": "yLfMJJiHn7vppQvDeKq4lIHoII0=", + "hash": "rxbuzZb2e7I9rAQHVduiXhm5sCw=", "name": "no-args", } `; diff --git a/packages/ui/atomic/create-atomic-result-component/tests/__snapshots__/test.spec.ts.snap b/packages/ui/atomic/create-atomic-result-component/tests/__snapshots__/test.spec.ts.snap index e7ce8b9d43..e0ffaecb0c 100644 --- a/packages/ui/atomic/create-atomic-result-component/tests/__snapshots__/test.spec.ts.snap +++ b/packages/ui/atomic/create-atomic-result-component/tests/__snapshots__/test.spec.ts.snap @@ -96,11 +96,11 @@ HashedFolder { HashedFolder { "children": [ HashedFile { - "hash": "wRrWASx36kB/WHP3xotlHQbcLdo=", + "hash": "L08E7dMK5e0wD5P8meKHfkDDa3o=", "name": "index.css", }, HashedFile { - "hash": "PzWUKvDClNOd5HSK8c6YTFV8/9Q=", + "hash": "2XR/MKCv0fo3uRpZRiTyOBoHk7s=", "name": "index.html", }, HashedFile { @@ -108,11 +108,11 @@ HashedFolder { "name": "index.ts", }, ], - "hash": "KaLKYWk10KFfD5NR/eQK0Zlk4qc=", + "hash": "V7y/8CwkVmHHCoFc1OqeZ9uA7Uo=", "name": "pages", }, ], - "hash": "v/N9sch/48xDZDBWiyo2WHlZRIc=", + "hash": "tx9LeVwzRbr7EbPQn8R05yI5yoA=", "name": "src", }, HashedFile { @@ -124,7 +124,7 @@ HashedFolder { "name": "tsconfig.json", }, ], - "hash": "/7wETCcwqh1Oc85xpdWhRL2WnsY=", + "hash": "bzV0SnoEBWUXWHsFx1d3VuESNf8=", "name": "no-args", } `; @@ -187,11 +187,11 @@ HashedFolder { HashedFolder { "children": [ HashedFile { - "hash": "wRrWASx36kB/WHP3xotlHQbcLdo=", + "hash": "L08E7dMK5e0wD5P8meKHfkDDa3o=", "name": "index.css", }, HashedFile { - "hash": "PzWUKvDClNOd5HSK8c6YTFV8/9Q=", + "hash": "2XR/MKCv0fo3uRpZRiTyOBoHk7s=", "name": "index.html", }, HashedFile { @@ -199,11 +199,11 @@ HashedFolder { "name": "index.ts", }, ], - "hash": "KaLKYWk10KFfD5NR/eQK0Zlk4qc=", + "hash": "V7y/8CwkVmHHCoFc1OqeZ9uA7Uo=", "name": "pages", }, ], - "hash": "yZITltdAONQtawJX1vSRIq2AIf8=", + "hash": "Y8OQ66dk8LqD/T1218hL3gat9HU=", "name": "src", }, HashedFile { @@ -215,7 +215,7 @@ HashedFolder { "name": "tsconfig.json", }, ], - "hash": "5asY7zPFxO4rAPWZ1e40dMgXyGM=", + "hash": "dNUnLReRFng2eqTXtSgo5PwKLKU=", "name": "invalid-arg", } `; @@ -278,11 +278,11 @@ HashedFolder { HashedFolder { "children": [ HashedFile { - "hash": "wRrWASx36kB/WHP3xotlHQbcLdo=", + "hash": "L08E7dMK5e0wD5P8meKHfkDDa3o=", "name": "index.css", }, HashedFile { - "hash": "PzWUKvDClNOd5HSK8c6YTFV8/9Q=", + "hash": "2XR/MKCv0fo3uRpZRiTyOBoHk7s=", "name": "index.html", }, HashedFile { @@ -290,11 +290,11 @@ HashedFolder { "name": "index.ts", }, ], - "hash": "KaLKYWk10KFfD5NR/eQK0Zlk4qc=", + "hash": "V7y/8CwkVmHHCoFc1OqeZ9uA7Uo=", "name": "pages", }, ], - "hash": "JohGg3PpEh+NJ5/VYWuHaBIAmwo=", + "hash": "1f3SQzBQ4wN87aoyIMsFNVo/o4Q=", "name": "src", }, HashedFile { @@ -306,7 +306,7 @@ HashedFolder { "name": "tsconfig.json", }, ], - "hash": "u63VLtXOXDlAja1qt0ZSHzIb6S0=", + "hash": "gTlFjvORWdK4/U+VBINBmeqAPfU=", "name": "valid-arg", } `; @@ -369,11 +369,11 @@ HashedFolder { HashedFolder { "children": [ HashedFile { - "hash": "wRrWASx36kB/WHP3xotlHQbcLdo=", + "hash": "L08E7dMK5e0wD5P8meKHfkDDa3o=", "name": "index.css", }, HashedFile { - "hash": "PzWUKvDClNOd5HSK8c6YTFV8/9Q=", + "hash": "2XR/MKCv0fo3uRpZRiTyOBoHk7s=", "name": "index.html", }, HashedFile { @@ -381,11 +381,11 @@ HashedFolder { "name": "index.ts", }, ], - "hash": "KaLKYWk10KFfD5NR/eQK0Zlk4qc=", + "hash": "V7y/8CwkVmHHCoFc1OqeZ9uA7Uo=", "name": "pages", }, ], - "hash": "Vj1k+9ckufnvP0iNhBBOVYt0IlA=", + "hash": "YR8hSYvHdEo8u2PuuyUUKyP3dVs=", "name": "src", }, HashedFile { @@ -397,7 +397,7 @@ HashedFolder { "name": "tsconfig.json", }, ], - "hash": "+oQYJGE4ju+lPH8IC8o1mXJYtMQ=", + "hash": "NRA2ixE+O40vg2igppwyG34HgBw=", "name": "no-args", } `; diff --git a/packages/ui/atomic/tempdoc/README.md b/packages/ui/atomic/tempdoc/README.md index 97fb3868dc..b75e9a5a01 100644 --- a/packages/ui/atomic/tempdoc/README.md +++ b/packages/ui/atomic/tempdoc/README.md @@ -22,7 +22,7 @@ The project generated by those commands consist of two parts: ## Developing 1. Add the component HTML tag in a page. - * When you create new pages in the `src/pages` folder, ensure you import the JS and CSS (refer to the `src/pages/index.html` of your generated project). + - When you create new pages in the `src/pages` folder, ensure you import the JS and CSS (refer to the `src/pages/index.html` of your generated project). 2. `npm start` 3. ??? 4. Profit. @@ -30,8 +30,8 @@ The project generated by those commands consist of two parts: ## Publishing 1. Open a command prompt in the directory of the component. - * Example: If you created a component named `omelette-au-fromage`, you would need to open a command prompt in `src/components/omelette-au-fromage`. + - Example: If you created a component named `omelette-au-fromage`, you would need to open a command prompt in `src/components/omelette-au-fromage`. 2. Ensure you are logged in with your npm account: `npm whoami`. 3. Run `npm publish`. -4. Profit. - * Your component is now available on `npm` and `unpkg`! +4. Profit. + - Your component is now available on `npm` and `unpkg`!