migrate showcase to new process

admin/scripts/resizeImage.js

@@ -19,6 +19,11 @@ const allImages = (
 const [, , ...selectedImages] = process.argv;
 const images = selectedImages.length > 0 ? selectedImages : allImages;
 
+const stats = {
+  skipped: 0,
+  resized: 0,
+};
+
 await Promise.all(
   images.map(async (img) => {
     const imgPath = fileURLToPath(
@@ -28,6 +33,7 @@ await Promise.all(
     if (width === 640 && height === 320 && imgPath.endsWith('.png')) {
       // Do not emit if not resized. Important because we can't guarantee
       // idempotency during resize -> optimization
+      stats.skipped += 1;
       return;
     }
     logger.info`Resized path=${imgPath}: Before number=${width}×number=${height}`;
@@ -36,9 +42,13 @@ await Promise.all(
       .png()
       .toBuffer();
     await fs.writeFile(imgPath.replace(/jpe?g/, 'png'), data);
+    stats.resized += 1;
   }),
 );
 
+console.log(`Showcase images resizing complete.
+${JSON.stringify(stats, null, 2)}`);
+
 // You should also run
 // optimizt `find website/src/data/showcase -type f -name '*.png'`.
 // This is not included here because @funboxteam/optimizt doesn't seem to play

website/src/data/users.tsx

@@ -11,51 +11,38 @@ import {translate} from '@docusaurus/Translate';
 import {sortBy} from '@site/src/utils/jsUtils';
 
 /*
- * ADD YOUR SITE TO THE DOCUSAURUS SHOWCASE:
+ * ADD YOUR SITE TO THE DOCUSAURUS SHOWCASE
  *
- * Requirements for adding your site to our showcase:
- * - It is a production-ready site with real content and decent customizations
- * (different from the init templates)
- * - It is NOT a work-in-progress with empty pages
- * - It has a stable domain (a Netlify/Vercel deploy preview is not allowed)
+ * Please don't submit a PR yourself: use the Github Discussion instead:
+ * https://github.com/facebook/docusaurus/discussions/7826
  *
- * Instructions:
- * - Add your site in the json array below
- * - `title` is your project's name (no need for the "Docs" suffix)
- * - A short (≤120 characters) description of your project
- * - Use relevant tags to categorize your site (read the tag descriptions on the
+ * Instructions for maintainers:
+ * - Add the site in the json array below
+ * - `title` is the project's name (no need for the "Docs" suffix)
+ * - A short (≤120 characters) description of the project
+ * - Use relevant tags to categorize the site (read the tag descriptions on the
  *   https://docusaurus.io/showcase page and some further clarifications below)
- * - Add a local image preview (decent screenshot of your Docusaurus site)
+ * - Add a local image preview (decent screenshot of the Docusaurus site)
  * - The image MUST be added to the GitHub repository, and use `require("img")`
  * - The image has to have minimum width 640 and an aspect of no wider than 2:1
- * - If your website is open-source, add your source link. The link should open
+ * - If a website is open-source, add a source link. The link should open
  *   to a directory containing the `docusaurus.config.js` file
+ * - Resize images: node admin/scripts/resizeImage.js
+ * - Run optimizt manually (see resize image script comment)
  * - Open a PR and check for reported CI errors
  *
  * Example PR: https://github.com/facebook/docusaurus/pull/7620
- *
- * If you edit this file through the GitHub interface, you can:
- * - Submit first your users.tsx edit PR
- * - This will create a branch on your Docusaurus fork (usually "patch-1")
- * - Go to https://github.com/<username>/docusaurus/tree/<branch>/website/src/data/showcase
- * - Drag-and-drop an image here to add it to your existing PR
- *
- * Please help us maintain this showcase page data:
- * - Update sites with wrong data
- * - Ensure site tags remain correct over time
- * - Remove sites not using Docusaurus anymore
- * - Add missing Docusaurus sites (if the site owner agreed)
  */
 
 // LIST OF AVAILABLE TAGS
-// Available tags to assign to your site
+// Available tags to assign to a showcase site
 // Please choose all tags that you think might apply.
 // We'll remove inappropriate tags, but it's less likely that we add tags.
 export type TagType =
   // DO NOT USE THIS TAG: we choose sites to add to favorites
   | 'favorite'
   // For open-source sites, a link to the source code is required.
-  // The source should be your *website's* source, not your project's source!
+  // The source should be the *website's* source, not the project's source!
   | 'opensource'
   | 'product'
   // Feel free to add the 'design' tag as long as there's _some_ level of
@@ -71,7 +58,7 @@ export type TagType =
   // Right-to-left direction.
   | 'rtl';
 
-// Add your site to this list
+// Add sites to this list
 // prettier-ignore
 const Users: User[] = [
   {

website/src/pages/showcase/index.tsx

@@ -37,8 +37,7 @@ const TITLE = translate({message: 'Docusaurus Site Showcase'});
 const DESCRIPTION = translate({
   message: 'List of websites people are building with Docusaurus',
 });
-const EDIT_URL =
-  'https://github.com/facebook/docusaurus/edit/main/website/src/data/users.tsx';
+const SUBMIT_URL = 'https://github.com/facebook/docusaurus/discussions/7826';
 
 type UserState = {
   scrollTopPosition: number;
@@ -126,7 +125,7 @@ function ShowcaseHeader() {
       <p>{DESCRIPTION}</p>
       <a
         className="button button--primary"
-        href={EDIT_URL}
+        href={SUBMIT_URL}
         target="_blank"
         rel="noreferrer">
         <Translate id="showcase.header.button">