From baa321bc79ad64411fae007794788b79e3e6e5c3 Mon Sep 17 00:00:00 2001
From: joshwooding <12938082+joshwooding@users.noreply.github.com>
Date: Thu, 24 Mar 2022 12:18:54 +0000
Subject: [PATCH 1/2] Revert "Remove __namedExportsOrder handling from store"

This reverts commit 0787dfcaadf66d4383ae9bff035cbeede11598b8.
---
 lib/store/src/csf/processCSFFile.test.ts |  6 +++---
 lib/store/src/csf/processCSFFile.ts      | 16 ++++++++++++++--
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/lib/store/src/csf/processCSFFile.test.ts b/lib/store/src/csf/processCSFFile.test.ts
index e5540f069901..921cee2a78e8 100644
--- a/lib/store/src/csf/processCSFFile.test.ts
+++ b/lib/store/src/csf/processCSFFile.test.ts
@@ -48,7 +48,7 @@ describe('processCSFFile', () => {
     });
   });
 
-  it('ignores __namedExportsOrder', () => {
+  it('adds stories in the right order if __namedExportsOrder is supplied', () => {
     const { stories } = processCSFFile(
       {
         default: { title: 'Component' },
@@ -63,10 +63,10 @@ describe('processCSFFile', () => {
     );
 
     expect(Object.keys(stories)).toEqual([
+      'component--w',
       'component--x',
-      'component--y',
       'component--z',
-      'component--w',
+      'component--y',
     ]);
   });
 
diff --git a/lib/store/src/csf/processCSFFile.ts b/lib/store/src/csf/processCSFFile.ts
index 02bf81c918cd..dcb553c30c1f 100644
--- a/lib/store/src/csf/processCSFFile.ts
+++ b/lib/store/src/csf/processCSFFile.ts
@@ -39,16 +39,28 @@ export function processCSFFile<TFramework extends AnyFramework>(
   title: ComponentTitle
 ): CSFFile<TFramework> {
   const { default: defaultExport, __namedExportsOrder, ...namedExports } = moduleExports;
+  let exports = namedExports;
 
   const meta: NormalizedComponentAnnotations<TFramework> =
     normalizeComponentAnnotations<TFramework>(defaultExport, title, importPath);
   checkDisallowedParameters(meta.parameters);
 
+  // prefer a user/loader provided `__namedExportsOrder` array if supplied
+  // we do this as es module exports are always ordered alphabetically
+  // see https://github.com/storybookjs/storybook/issues/9136
+  if (Array.isArray(__namedExportsOrder)) {
+    exports = {};
+    __namedExportsOrder.forEach((name) => {
+      const namedExport = namedExports[name];
+      if (namedExport) exports[name] = namedExport;
+    });
+  }
+
   const csfFile: CSFFile<TFramework> = { meta, stories: {} };
 
-  Object.keys(namedExports).forEach((key) => {
+  Object.keys(exports).forEach((key) => {
     if (isExportStory(key, meta)) {
-      const storyMeta = normalizeStory(key, namedExports[key], meta);
+      const storyMeta = normalizeStory(key, exports[key], meta);
       checkDisallowedParameters(storyMeta.parameters);
 
       csfFile.stories[storyMeta.id] = storyMeta;

From a3b5e09a40cf5987707840791038c8606b41b4c2 Mon Sep 17 00:00:00 2001
From: joshwooding <12938082+joshwooding@users.noreply.github.com>
Date: Thu, 24 Mar 2022 12:24:11 +0000
Subject: [PATCH 2/2] Add comment to __namedExportsOrder handling in
 processCSFFile

---
 lib/store/src/csf/processCSFFile.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/lib/store/src/csf/processCSFFile.ts b/lib/store/src/csf/processCSFFile.ts
index dcb553c30c1f..1d6965064f90 100644
--- a/lib/store/src/csf/processCSFFile.ts
+++ b/lib/store/src/csf/processCSFFile.ts
@@ -48,6 +48,7 @@ export function processCSFFile<TFramework extends AnyFramework>(
   // prefer a user/loader provided `__namedExportsOrder` array if supplied
   // we do this as es module exports are always ordered alphabetically
   // see https://github.com/storybookjs/storybook/issues/9136
+  // This directly affects the order of stories in the docs view and in folders on the sidebar.
   if (Array.isArray(__namedExportsOrder)) {
     exports = {};
     __namedExportsOrder.forEach((name) => {