Fixes for test cases and some misc. issues

.gitignore

@@ -3,3 +3,5 @@ dist
 coverage
 .vscode
 server-build
+
+*storybook.log

.prettierrc

@@ -1,7 +1,7 @@
 {
     "trailingComma": "all",
     "tabWidth": 2,
-    "semi": true,
+    "semi": false,
     "singleQuote": true,
     "endOfLine": "lf",
     "printWidth": 140

.storybook/main.js

@@ -1,21 +1,20 @@
-const path = require('path');
-
-// Export a function. Accept the base config as the only param.
-module.exports = {
-  stories: ["../src/**/*.story.jsx"],
-  webpackFinal: async (config, { configType }) => {
-    // `configType` has a value of 'DEVELOPMENT' or 'PRODUCTION'
-    // You can change the configuration based on that.
-    // 'PRODUCTION' is used when building the static version of storybook.
-
-    // Make whatever fine-grained changes you need
-    config.module.rules.push({
-      test: /\.scss$/,
-      use: ['style-loader', 'css-loader', 'sass-loader'],
-      include: path.resolve(__dirname, '../src'),
-    });
-
-    // Return the altered config
-    return config;
+/** @type { import('@storybook/react-webpack5').StorybookConfig } */
+const config = {
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  addons: [
+    '@storybook/addon-webpack5-compiler-swc',
+    '@storybook/addon-onboarding',
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@chromatic-com/storybook',
+    '@storybook/addon-interactions',
+  ],
+  framework: {
+    name: '@storybook/react-webpack5',
+    options: {},
   },
-};
+  docs: {
+    autodocs: 'tag',
+  },
+}
+export default config

.storybook/preview.js

@@ -0,0 +1,13 @@
+/** @type { import('@storybook/react').Preview } */
+const preview = {
+  parameters: {
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+  },
+}
+
+export default preview

README.md

@@ -101,6 +101,9 @@ To run Bundle Analyzer
 npm run build-analyze
 ```
 
+In case storybook does not work
+npx sb init
+
 
 ## Contributors ✨