Fix styleguide

.gitignore

@@ -39,3 +39,6 @@ yarn-error.log*
 # lint cache
 .eslintcache
 *.cache
+
+# styleguide build
+/styleguide

package.json

@@ -10,13 +10,10 @@
     "format": "prettier --write .",
     "format:check": "prettier --check .",
     "lint": "next lint --fix",
-    "lint:check": "next lint"
-  },
-  "engines": {
-    "node": "^18"
+    "lint:check": "next lint",
+    "documentation": "styleguidist server"
   },
   "dependencies": {
-    "@babel/runtime": "^7.17.9",
     "@emotion/react": "^11.8.1",
     "@emotion/styled": "^11.6.0",
     "@mui/icons-material": "^6.1.2",
@@ -61,7 +58,6 @@
     "@typescript-eslint/parser": "^8.8.1",
     "babel-loader": "^9.1.2",
     "babel-plugin-styled-components": "^2.1.1",
-    "babel-polyfill": "^6.26.0",
     "eslint": "^8.57.1",
     "eslint-config-next": "^14.2.14",
     "eslint-config-prettier": "^9.1.0",

styleguide.config.js

@@ -1,9 +1,10 @@
 const path = require('path');
 const webpack = require('webpack');
 const dotenv = require('dotenv').config({ path: __dirname + '/.env' });
+
 module.exports = {
   pagePerSection: true,
-  title: 'UTD Trends Style Guide',
+  title: 'UTD Trends Documentation',
   template: {
     links: [
       {
@@ -30,69 +31,87 @@ module.exports = {
       name: 'Navigation Components',
       components: ['./src/components/navigation/**/*.tsx'],
     },
+    {
+      name: 'Dashboard Components',
+      components: ['./src/components/dashboard/**/*.tsx'],
+    },
+    {
+      name: 'Overview Components',
+      components: ['./src/components/overview/**/*.tsx'],
+    },
+    {
+      name: 'Search Components',
+      components: ['./src/components/search/**/*.tsx'],
+    },
     {
       name: 'Graph Components',
       content: './src/components/graph/GraphProps.md',
       components: ['./src/components/graph/**/*.tsx'],
     },
+    {
+      name: 'Compare Components',
+      components: ['./src/components/compare/**/*.tsx'],
+    },
     {
       name: 'Icon Components',
       components: ['./src/components/icons/**/*.tsx'],
     },
   ],
 
   propsParser: require('react-docgen-typescript').parse,
-  require: [
-    path.resolve(__dirname, 'styleguide/setup.js'),
-    path.join(__dirname, './src/styles/globals.css'),
-  ],
+  require: [path.join(__dirname, './src/styles/globals.css')],
   webpackConfig: {
+    resolve: {
+      alias: {
+        '@': path.resolve(__dirname, 'src'),
+      },
+      fallback: {
+        zlib: false,
+        stream: false,
+        fs: false,
+      },
+    },
     plugins: [
       new webpack.DefinePlugin({
         'process.env': JSON.stringify(dotenv.parsed),
       }),
     ],
     module: {
       rules: [
+        // File Loaders that are needed for your components
         {
           test: /\.tsx?$/,
           exclude: /node_modules/,
           loader: 'babel-loader',
         },
-        // Other loaders that are needed for your components
         {
-          test: /\.css$/,
+          test: /\.md$/,
           use: [
-            'style-loader',
-            'css-loader',
             {
-              loader: 'postcss-loader',
-              options: {
-                postcssOptions: {
-                  plugins: [
-                    [
-                      'postcss-preset-env',
-                      {
-                        // Options
-                      },
-                    ],
-                  ],
-                },
-              },
+              loader: 'html-loader',
+            },
+            {
+              loader: 'markdown-loader',
             },
           ],
         },
         {
-          test: /\.md$/,
+          test: /\.css$/,
           use: [
+            'style-loader',
+            'css-loader',
             {
-              loader: 'html-loader',
-            },
-            {
-              loader: 'markdown-loader',
+              loader: 'postcss-loader',
             },
           ],
         },
+        {
+          test: /\.(png)$/,
+          type: 'asset/resource',
+          generator: {
+            filename: 'assets/[name][ext]',
+          },
+        },
       ],
     },
   },