chore: restructure storybook folders (#1092)

* chore: restructure storybook folders

* update snapshots

Author: fabianhueske

packages/component-library/.storybook/manager.js

@@ -3,4 +3,7 @@ import { darkTheme, lightTheme } from "./shopwareTheme";
 
 addons.setConfig({
   theme: darkTheme,
+  sidebar: {
+    collapsedRoots: ["composables", "directives"],
+  },
 });

packages/component-library/.storybook/preview.ts

@@ -36,6 +36,11 @@ setup((app) => {
 
 const preview: Preview = {
   parameters: {
+    options: {
+      storySort: {
+        method: "alphabetical",
+      },
+    },
     controls: {
       matchers: {
         color: /(background|color)$/i,

packages/component-library/.storybook/test-runner.ts

@@ -14,24 +14,24 @@ export default {
 
     // use bigger viewport for data-table and toasts
     if (
-      context.id.startsWith("interaction-tests-table-and-list") ||
-      context.id.startsWith("interaction-tests-entity-mt-entity-data-table") ||
-      context.id.startsWith("interaction-tests-feedback-indicator-mt-toast")
+      context.id.startsWith("components-mt-data-table-interaction-tests") ||
+      context.id.startsWith("components-mt-entity-data-table-interaction-tests") ||
+      context.id.startsWith("components-mt-toast-interaction-tests")
     ) {
       await page.setViewportSize({ width: 1600, height: 900 });
     }
 
     // use smaller viewport to test wrapping of multi select
     if (
       context.id ===
-      "interaction-tests-form-mt-select--visual-test-ensure-correct-multi-selection-wrapping"
+      "components-mt-select-interaction-tests--visual-test-ensure-correct-multi-selection-wrapping"
     ) {
       await page.setViewportSize({ width: 500, height: 650 });
     }
   },
   async postRender(page, context) {
     // Render screenshots only for interaction tests with Visual Test name
-    if (!context.id.startsWith("interaction-tests") || !context.name.startsWith("Visual Test")) {
+    if (!context.id.includes("-interaction-tests--") || !context.name.startsWith("Visual Test")) {
       return;
     }