[CL-317] Use storybook theme addon for theme switching (#13451)

libs/components/src/drawer/drawer.stories.ts

@@ -9,10 +9,7 @@ import { ButtonModule } from "../button";
 import { CalloutModule } from "../callout";
 import { LayoutComponent } from "../layout";
 import { mockLayoutI18n } from "../layout/mocks";
-import {
-  disableBothThemeDecorator,
-  positionFixedWrapperDecorator,
-} from "../stories/storybook-decorators";
+import { positionFixedWrapperDecorator } from "../stories/storybook-decorators";
 import { TypographyModule } from "../typography";
 import { I18nMockService } from "../utils";
 
@@ -30,7 +27,6 @@ export default {
   },
   decorators: [
     positionFixedWrapperDecorator(),
-    disableBothThemeDecorator,
     moduleMetadata({
       imports: [
         RouterTestingModule,

libs/components/src/stories/kitchen-sink/kitchen-sink.stories.ts

@@ -17,7 +17,7 @@ import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.servic
 import { DialogService } from "../../dialog";
 import { LayoutComponent } from "../../layout";
 import { I18nMockService } from "../../utils/i18n-mock.service";
-import { disableBothThemeDecorator, positionFixedWrapperDecorator } from "../storybook-decorators";
+import { positionFixedWrapperDecorator } from "../storybook-decorators";
 
 import { DialogVirtualScrollBlockComponent } from "./components/dialog-virtual-scroll-block.component";
 import { KitchenSinkForm } from "./components/kitchen-sink-form.component";
@@ -31,7 +31,6 @@ export default {
   component: LayoutComponent,
   decorators: [
     positionFixedWrapperDecorator(),
-    disableBothThemeDecorator,
     moduleMetadata({
       imports: [
         KitchenSinkSharedModule,

libs/components/src/stories/storybook-decorators.ts

@@ -17,15 +17,3 @@ export const positionFixedWrapperDecorator = (wrapper?: (story: string) => strin
         ${wrapper ? wrapper(story) : story}
       </div>`,
   );
-
-export const disableBothThemeDecorator = componentWrapperDecorator(
-  (story) => story,
-  ({ globals }) => {
-    /**
-     * avoid a bug with the way that we render the same component twice in the same iframe and how
-     * that interacts with the router-outlet
-     */
-    const themeOverride = globals["theme"] === "both" ? "light" : globals["theme"];
-    return { theme: themeOverride };
-  },
-);