test(storybook): stories for the details sidebar

Add stories for details sidebar components. Mock data selection API requests with MSW.

frontend/.storybook/main.ts

@@ -14,5 +14,6 @@ const config: StorybookConfig = {
     name: '@storybook/react-vite',
     options: {},
   },
+  staticDirs: ['../public'],
 };
 export default config;

frontend/.storybook/preview.tsx

@@ -1,10 +1,18 @@
 import * as React from 'react';
 import type { Preview } from '@storybook/react';
+import { initialize, mswLoader } from 'msw-storybook-addon';
 import { atom, RecoilRoot } from 'recoil';
 import { useSyncRecoilState } from '../src/lib/recoil/sync-state';
 import { viewStateEffect } from '../src/app/state/view';
 import { useStateEffect } from '../src/lib/recoil/state-effects/use-state-effect';
 
+/*
+ * Initializes MSW
+ * See https://github.com/mswjs/msw-storybook-addon#configuring-msw
+ * to learn how to customize it
+ */
+initialize();
+
 const mockViewState = atom({
   key: 'mockViewState',
   default: 'exposure',
@@ -34,6 +42,7 @@ const preview: Preview = {
       </RecoilRoot>
     ),
   ],
+  loaders: [mswLoader],
 };
 
 export default preview;