diff --git a/.dockerignore b/.dockerignore
new file mode 100644
index 00000000..8a678147
--- /dev/null
+++ b/.dockerignore
@@ -0,0 +1,3 @@
+node_modules
+Dockerfile
+docker-compose.*
diff --git a/.erb/configs/webpack.config.renderer.dev.ts b/.erb/configs/webpack.config.renderer.dev.ts
index f6ca25d8..46e51530 100644
--- a/.erb/configs/webpack.config.renderer.dev.ts
+++ b/.erb/configs/webpack.config.renderer.dev.ts
@@ -16,7 +16,7 @@ import webpackPaths from './webpack.paths';
 // When an ESLint server is running, we can't set the NODE_ENV so we'll check if it's
 // at the dev webpack config is not accidentally run in a production environment
 if (process.env.NODE_ENV === 'production') {
-  checkNodeEnv('development');
+    checkNodeEnv('development');
 }
 
 const port = process.env.PORT || 4343;
@@ -28,171 +28,174 @@ const requiredByDLLConfig = module.parent!.filename.includes('webpack.config.ren
  * Warn if the DLL is not built
  */
 if (!requiredByDLLConfig && !(fs.existsSync(webpackPaths.dllPath) && fs.existsSync(manifest))) {
-  console.log(
-    chalk.black.bgYellow.bold(
-      'The DLL files are missing. Sit back while we build them for you with "npm run build-dll"',
-    ),
-  );
-  execSync('npm run postinstall');
+    console.log(
+        chalk.black.bgYellow.bold(
+            'The DLL files are missing. Sit back while we build them for you with "npm run build-dll"',
+        ),
+    );
+    execSync('npm run postinstall');
 }
 
 const configuration: webpack.Configuration = {
-  devtool: 'inline-source-map',
+    devtool: 'inline-source-map',
 
-  mode: 'development',
+    mode: 'development',
 
-  target: ['web', 'electron-renderer'],
+    target: ['web', 'electron-renderer'],
 
-  entry: [
-    `webpack-dev-server/client?http://localhost:${port}/dist`,
-    'webpack/hot/only-dev-server',
-    path.join(webpackPaths.srcRendererPath, 'index.tsx'),
-  ],
-
-  output: {
-    path: webpackPaths.distRendererPath,
-    publicPath: '/',
-    filename: 'renderer.dev.js',
-    library: {
-      type: 'umd',
-    },
-  },
-
-  module: {
-    rules: [
-      {
-        test: /\.s?css$/,
-        use: [
-          'style-loader',
-          {
-            loader: 'css-loader',
-            options: {
-              modules: {
-                localIdentName: '[name]__[local]--[hash:base64:5]',
-                exportLocalsConvention: 'camelCaseOnly',
-              },
-              sourceMap: true,
-              importLoaders: 1,
-            },
-          },
-          'sass-loader',
-        ],
-        include: /\.module\.s?(c|a)ss$/,
-      },
-      {
-        test: /\.s?css$/,
-        use: ['style-loader', 'css-loader', 'sass-loader'],
-        exclude: /\.module\.s?(c|a)ss$/,
-      },
-      // Fonts
-      {
-        test: /\.(woff|woff2|eot|ttf|otf)$/i,
-        type: 'asset/resource',
-      },
-      // Images
-      {
-        test: /\.(png|svg|jpg|jpeg|gif)$/i,
-        type: 'asset/resource',
-      },
+    entry: [
+        `webpack-dev-server/client?http://localhost:${port}/dist`,
+        'webpack/hot/only-dev-server',
+        path.join(webpackPaths.srcRendererPath, 'index.tsx'),
     ],
-  },
-  plugins: [
-    ...(requiredByDLLConfig
-      ? []
-      : [
-          new webpack.DllReferencePlugin({
-            context: webpackPaths.dllPath,
-            manifest: require(manifest),
-            sourceType: 'var',
-          }),
-        ]),
 
-    new webpack.NoEmitOnErrorsPlugin(),
-
-    /**
-     * Create global constants which can be configured at compile time.
-     *
-     * Useful for allowing different behaviour between development builds and
-     * release builds
-     *
-     * NODE_ENV should be production so that modules do not perform certain
-     * development checks
-     *
-     * By default, use 'development' as NODE_ENV. This can be overriden with
-     * 'staging', for example, by changing the ENV variables in the npm scripts
-     */
-    new webpack.EnvironmentPlugin({
-      NODE_ENV: 'development',
-    }),
-
-    new webpack.LoaderOptionsPlugin({
-      debug: true,
-    }),
-
-    new ReactRefreshWebpackPlugin(),
-
-    new HtmlWebpackPlugin({
-      filename: path.join('index.html'),
-      template: path.join(webpackPaths.srcRendererPath, 'index.ejs'),
-      minify: {
-        collapseWhitespace: true,
-        removeAttributeQuotes: true,
-        removeComments: true,
-      },
-      isBrowser: false,
-      env: process.env.NODE_ENV,
-      isDevelopment: process.env.NODE_ENV !== 'production',
-      nodeModules: webpackPaths.appNodeModulesPath,
-    }),
-  ],
-
-  node: {
-    __dirname: false,
-    __filename: false,
-  },
-
-  devServer: {
-    port,
-    compress: true,
-    hot: true,
-    headers: { 'Access-Control-Allow-Origin': '*' },
-    static: {
-      publicPath: '/',
+    output: {
+        path: webpackPaths.distRendererPath,
+        publicPath: '/',
+        filename: 'renderer.dev.js',
+        library: {
+            type: 'umd',
+        },
     },
-    historyApiFallback: {
-      verbose: true,
-    },
-    setupMiddlewares(middlewares) {
-      console.log('Starting preload.js builder...');
-      const preloadProcess = spawn('npm', ['run', 'start:preload'], {
-        shell: true,
-        stdio: 'inherit',
-      })
-        .on('close', (code: number) => process.exit(code!))
-        .on('error', (spawnError) => console.error(spawnError));
 
-      console.log('Starting remote.js builder...');
-      const remoteProcess = spawn('npm', ['run', 'start:remote'], {
-        shell: true,
-        stdio: 'inherit',
-      })
-        .on('close', (code: number) => process.exit(code!))
-        .on('error', (spawnError) => console.error(spawnError));
-
-      console.log('Starting Main Process...');
-      spawn('npm', ['run', 'start:main'], {
-        shell: true,
-        stdio: 'inherit',
-      })
-        .on('close', (code: number) => {
-          preloadProcess.kill();
-          remoteProcess.kill();
-          process.exit(code!);
-        })
-        .on('error', (spawnError) => console.error(spawnError));
-      return middlewares;
+    module: {
+        rules: [
+            {
+                test: /\.s?css$/,
+                use: [
+                    'style-loader',
+                    {
+                        loader: 'css-loader',
+                        options: {
+                            modules: {
+                                localIdentName: '[name]__[local]--[hash:base64:5]',
+                                exportLocalsConvention: 'camelCaseOnly',
+                            },
+                            sourceMap: true,
+                            importLoaders: 1,
+                        },
+                    },
+                    'sass-loader',
+                ],
+                include: /\.module\.s?(c|a)ss$/,
+            },
+            {
+                test: /\.s?css$/,
+                use: ['style-loader', 'css-loader', 'sass-loader'],
+                exclude: /\.module\.s?(c|a)ss$/,
+            },
+            // Fonts
+            {
+                test: /\.(woff|woff2|eot|ttf|otf)$/i,
+                type: 'asset/resource',
+            },
+            // Images
+            {
+                test: /\.(png|svg|jpg|jpeg|gif)$/i,
+                type: 'asset/resource',
+            },
+        ],
+    },
+    plugins: [
+        ...(requiredByDLLConfig
+            ? []
+            : [
+                  new webpack.DllReferencePlugin({
+                      context: webpackPaths.dllPath,
+                      manifest: require(manifest),
+                      sourceType: 'var',
+                  }),
+              ]),
+
+        new webpack.NoEmitOnErrorsPlugin(),
+
+        /**
+         * Create global constants which can be configured at compile time.
+         *
+         * Useful for allowing different behaviour between development builds and
+         * release builds
+         *
+         * NODE_ENV should be production so that modules do not perform certain
+         * development checks
+         *
+         * By default, use 'development' as NODE_ENV. This can be overriden with
+         * 'staging', for example, by changing the ENV variables in the npm scripts
+         */
+        new webpack.EnvironmentPlugin({
+            NODE_ENV: 'development',
+        }),
+
+        new webpack.LoaderOptionsPlugin({
+            debug: true,
+        }),
+
+        new ReactRefreshWebpackPlugin(),
+
+        new HtmlWebpackPlugin({
+            filename: path.join('index.html'),
+            template: path.join(webpackPaths.srcRendererPath, 'index.ejs'),
+            minify: {
+                collapseWhitespace: true,
+                removeAttributeQuotes: true,
+                removeComments: true,
+            },
+            isBrowser: false,
+            env: process.env.NODE_ENV,
+            isDevelopment: process.env.NODE_ENV !== 'production',
+            nodeModules: webpackPaths.appNodeModulesPath,
+            templateParameters: {
+                web: false,
+            },
+        }),
+    ],
+
+    node: {
+        __dirname: false,
+        __filename: false,
+    },
+
+    devServer: {
+        port,
+        compress: true,
+        hot: true,
+        headers: { 'Access-Control-Allow-Origin': '*' },
+        static: {
+            publicPath: '/',
+        },
+        historyApiFallback: {
+            verbose: true,
+        },
+        setupMiddlewares(middlewares) {
+            console.log('Starting preload.js builder...');
+            const preloadProcess = spawn('npm', ['run', 'start:preload'], {
+                shell: true,
+                stdio: 'inherit',
+            })
+                .on('close', (code: number) => process.exit(code!))
+                .on('error', (spawnError) => console.error(spawnError));
+
+            console.log('Starting remote.js builder...');
+            const remoteProcess = spawn('npm', ['run', 'start:remote'], {
+                shell: true,
+                stdio: 'inherit',
+            })
+                .on('close', (code: number) => process.exit(code!))
+                .on('error', (spawnError) => console.error(spawnError));
+
+            console.log('Starting Main Process...');
+            spawn('npm', ['run', 'start:main'], {
+                shell: true,
+                stdio: 'inherit',
+            })
+                .on('close', (code: number) => {
+                    preloadProcess.kill();
+                    remoteProcess.kill();
+                    process.exit(code!);
+                })
+                .on('error', (spawnError) => console.error(spawnError));
+            return middlewares;
+        },
     },
-  },
 };
 
 export default merge(baseConfig, configuration);
diff --git a/.erb/configs/webpack.config.renderer.prod.ts b/.erb/configs/webpack.config.renderer.prod.ts
index 324630a7..379bb2d0 100644
--- a/.erb/configs/webpack.config.renderer.prod.ts
+++ b/.erb/configs/webpack.config.renderer.prod.ts
@@ -21,114 +21,117 @@ checkNodeEnv('production');
 deleteSourceMaps();
 
 const devtoolsConfig =
-  process.env.DEBUG_PROD === 'true'
-    ? {
-        devtool: 'source-map',
-      }
-    : {};
+    process.env.DEBUG_PROD === 'true'
+        ? {
+              devtool: 'source-map',
+          }
+        : {};
 
 const configuration: webpack.Configuration = {
-  ...devtoolsConfig,
+    ...devtoolsConfig,
 
-  mode: 'production',
+    mode: 'production',
 
-  target: ['web', 'electron-renderer'],
+    target: ['web', 'electron-renderer'],
 
-  entry: [path.join(webpackPaths.srcRendererPath, 'index.tsx')],
+    entry: [path.join(webpackPaths.srcRendererPath, 'index.tsx')],
 
-  output: {
-    path: webpackPaths.distRendererPath,
-    publicPath: './',
-    filename: 'renderer.js',
-    library: {
-      type: 'umd',
+    output: {
+        path: webpackPaths.distRendererPath,
+        publicPath: './',
+        filename: 'renderer.js',
+        library: {
+            type: 'umd',
+        },
     },
-  },
 
-  module: {
-    rules: [
-      {
-        test: /\.s?(a|c)ss$/,
-        use: [
-          MiniCssExtractPlugin.loader,
-          {
-            loader: 'css-loader',
-            options: {
-              modules: {
-                localIdentName: '[name]__[local]--[hash:base64:5]',
-                exportLocalsConvention: 'camelCaseOnly',
-              },
-              sourceMap: true,
-              importLoaders: 1,
+    module: {
+        rules: [
+            {
+                test: /\.s?(a|c)ss$/,
+                use: [
+                    MiniCssExtractPlugin.loader,
+                    {
+                        loader: 'css-loader',
+                        options: {
+                            modules: {
+                                localIdentName: '[name]__[local]--[hash:base64:5]',
+                                exportLocalsConvention: 'camelCaseOnly',
+                            },
+                            sourceMap: true,
+                            importLoaders: 1,
+                        },
+                    },
+                    'sass-loader',
+                ],
+                include: /\.module\.s?(c|a)ss$/,
+            },
+            {
+                test: /\.s?(a|c)ss$/,
+                use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
+                exclude: /\.module\.s?(c|a)ss$/,
+            },
+            // Fonts
+            {
+                test: /\.(woff|woff2|eot|ttf|otf)$/i,
+                type: 'asset/resource',
+            },
+            // Images
+            {
+                test: /\.(png|svg|jpg|jpeg|gif)$/i,
+                type: 'asset/resource',
             },
-          },
-          'sass-loader',
         ],
-        include: /\.module\.s?(c|a)ss$/,
-      },
-      {
-        test: /\.s?(a|c)ss$/,
-        use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
-        exclude: /\.module\.s?(c|a)ss$/,
-      },
-      // Fonts
-      {
-        test: /\.(woff|woff2|eot|ttf|otf)$/i,
-        type: 'asset/resource',
-      },
-      // Images
-      {
-        test: /\.(png|svg|jpg|jpeg|gif)$/i,
-        type: 'asset/resource',
-      },
+    },
+
+    optimization: {
+        minimize: true,
+        minimizer: [
+            new TerserPlugin({
+                parallel: true,
+            }),
+            new CssMinimizerPlugin(),
+        ],
+    },
+
+    plugins: [
+        /**
+         * Create global constants which can be configured at compile time.
+         *
+         * Useful for allowing different behaviour between development builds and
+         * release builds
+         *
+         * NODE_ENV should be production so that modules do not perform certain
+         * development checks
+         */
+        new webpack.EnvironmentPlugin({
+            NODE_ENV: 'production',
+            DEBUG_PROD: false,
+        }),
+
+        new MiniCssExtractPlugin({
+            filename: 'style.css',
+        }),
+
+        new BundleAnalyzerPlugin({
+            analyzerMode: process.env.ANALYZE === 'true' ? 'server' : 'disabled',
+        }),
+
+        new HtmlWebpackPlugin({
+            filename: 'index.html',
+            template: path.join(webpackPaths.srcRendererPath, 'index.ejs'),
+            minify: {
+                collapseWhitespace: true,
+                removeAttributeQuotes: true,
+                removeComments: true,
+            },
+            isBrowser: false,
+            isDevelopment: process.env.NODE_ENV !== 'production',
+            templateParameters: {
+                web: false,
+            },
+        }),
     ],
-  },
-
-  optimization: {
-    minimize: true,
-    minimizer: [
-      new TerserPlugin({
-        parallel: true,
-      }),
-      new CssMinimizerPlugin(),
-    ],
-  },
-
-  plugins: [
-    /**
-     * Create global constants which can be configured at compile time.
-     *
-     * Useful for allowing different behaviour between development builds and
-     * release builds
-     *
-     * NODE_ENV should be production so that modules do not perform certain
-     * development checks
-     */
-    new webpack.EnvironmentPlugin({
-      NODE_ENV: 'production',
-      DEBUG_PROD: false,
-    }),
-
-    new MiniCssExtractPlugin({
-      filename: 'style.css',
-    }),
-
-    new BundleAnalyzerPlugin({
-      analyzerMode: process.env.ANALYZE === 'true' ? 'server' : 'disabled',
-    }),
-
-    new HtmlWebpackPlugin({
-      filename: 'index.html',
-      template: path.join(webpackPaths.srcRendererPath, 'index.ejs'),
-      minify: {
-        collapseWhitespace: true,
-        removeAttributeQuotes: true,
-        removeComments: true,
-      },
-      isBrowser: false,
-      isDevelopment: process.env.NODE_ENV !== 'production',
-    }),
-  ],
 };
 
 export default merge(baseConfig, configuration);
diff --git a/.erb/configs/webpack.config.renderer.web.ts b/.erb/configs/webpack.config.renderer.web.ts
index 39fca511..82b5f79a 100644
--- a/.erb/configs/webpack.config.renderer.web.ts
+++ b/.erb/configs/webpack.config.renderer.web.ts
@@ -116,6 +116,9 @@ const configuration: webpack.Configuration = {
             env: process.env.NODE_ENV,
             isDevelopment: process.env.NODE_ENV !== 'production',
             nodeModules: webpackPaths.appNodeModulesPath,
+            templateParameters: {
+                web: false, // with hot reload, we don't have NGINX injecting variables
+            },
         }),
     ],
 
diff --git a/.erb/configs/webpack.config.web.prod.ts b/.erb/configs/webpack.config.web.prod.ts
index 73cc32fc..ed935fd6 100644
--- a/.erb/configs/webpack.config.web.prod.ts
+++ b/.erb/configs/webpack.config.web.prod.ts
@@ -128,6 +128,9 @@ const configuration: webpack.Configuration = {
             },
             isBrowser: false,
             isDevelopment: process.env.NODE_ENV !== 'production',
+            templateParameters: {
+                web: true,
+            },
         }),
     ],
 };
diff --git a/Dockerfile b/Dockerfile
index 856af4d2..fdf2c6ca 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,16 +1,20 @@
 # --- Builder stage
 FROM node:18-alpine as builder
 WORKDIR /app
-COPY . /app
 
+#Copy package.json first to cache node_modules
+COPY package.json package-lock.json .
 # Scripts include electron-specific dependencies, which we don't need
 RUN npm install --legacy-peer-deps --ignore-scripts
+#Copy code and build with cached modules
+COPY . .
 RUN npm run build:web
 
 # --- Production stage
 FROM nginx:alpine-slim
 
 COPY --chown=nginx:nginx --from=builder /app/release/app/dist/web /usr/share/nginx/html
+COPY ./settings.js.template /etc/nginx/templates/settings.js.template
 COPY ng.conf.template /etc/nginx/templates/default.conf.template
 
 ENV PUBLIC_PATH="/"
diff --git a/README.md b/README.md
index faa5513b..a4a28652 100644
--- a/README.md
+++ b/README.md
@@ -81,6 +81,8 @@ docker run --name feishin -p 9180:9180 feishin
 
 3. _Optional_ - If you want to host Feishin on a subpath (not `/`), then pass in the following environment variable: `PUBLIC_PATH=PATH`. For example, to host on `/feishin`, pass in `PUBLIC_PATH=/feishin`.
 
+4. _Optional_ - To hard code the server url, pass the following environment variables: `SERVER_NAME`, `SERVER_TYPE` (one of `jellyfin` or `navidrome`), `SERVER_URL`. To prevent users from changing these settings, pass `SERVER_LOCK=true`. This can only be set if all three of the previous values are set.
+
 ## FAQ
 
 ### MPV is either not working or is rapidly switching between pause/play states
diff --git a/docker-compose.yaml b/docker-compose.yaml
new file mode 100644
index 00000000..44308381
--- /dev/null
+++ b/docker-compose.yaml
@@ -0,0 +1,13 @@
+version: '3.5'
+services:
+    feishin:
+        container_name: feishin
+        image: jeffvli/feishin
+        restart: unless-stopped
+        ports:
+            - 9180:9180
+        environment:
+            - SERVER_NAME=jellyfin # pre defined server name
+            - SERVER_LOCK=true # When true AND name/type/url are set, only username/password can be toggled
+            - SERVER_TYPE=jellyfin # navidrome also works
+            - SERVER_URL= # http://address:port
diff --git a/ng.conf.template b/ng.conf.template
index 3fed35b8..eb46ff72 100644
--- a/ng.conf.template
+++ b/ng.conf.template
@@ -16,4 +16,12 @@ server {
     alias /usr/share/nginx/html/;
     try_files $uri $uri/ /index.html =404;
   }
+
+  location ${PUBLIC_PATH}settings.js {
+    alias /etc/nginx/conf.d/settings.js;
+  }
+
+  location ${PUBLIC_PATH}/settings.js {
+    alias /etc/nginx/conf.d/settings.js;
+  }
 }
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 5689d9db..7a7f0940 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -66,6 +66,7 @@
                 "react-virtualized-auto-sizer": "^1.0.17",
                 "react-window": "^1.8.9",
                 "react-window-infinite-loader": "^1.0.9",
+                "semver": "^7.5.4",
                 "styled-components": "^6.0.8",
                 "swiper": "^9.3.1",
                 "zod": "^3.22.3",
@@ -5023,7 +5024,7 @@
             "version": "15.7.4",
             "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz",
             "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==",
-            "devOptional": true
+            "dev": true
         },
         "node_modules/@types/qs": {
             "version": "6.9.7",
@@ -5041,7 +5042,7 @@
             "version": "18.0.26",
             "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.26.tgz",
             "integrity": "sha512-hCR3PJQsAIXyxhTNSiDFY//LhnMZWpNNr5etoCqx/iUfGc5gXWtQR2Phl908jVR6uPXacojQWTg4qRpkxTuGug==",
-            "devOptional": true,
+            "dev": true,
             "dependencies": {
                 "@types/prop-types": "*",
                 "@types/scheduler": "*",
@@ -5113,7 +5114,7 @@
             "version": "0.16.2",
             "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
             "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==",
-            "devOptional": true
+            "dev": true
         },
         "node_modules/@types/semver": {
             "version": "7.3.13",
@@ -6445,30 +6446,6 @@
                 "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
             }
         },
-        "node_modules/babel-plugin-styled-components": {
-            "version": "2.0.7",
-            "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-2.0.7.tgz",
-            "integrity": "sha512-i7YhvPgVqRKfoQ66toiZ06jPNA3p6ierpfUuEWxNF+fV27Uv5gxBkf8KZLHUCc1nFA9j6+80pYoIpqCeyW3/bA==",
-            "optional": true,
-            "peer": true,
-            "dependencies": {
-                "@babel/helper-annotate-as-pure": "^7.16.0",
-                "@babel/helper-module-imports": "^7.16.0",
-                "babel-plugin-syntax-jsx": "^6.18.0",
-                "lodash": "^4.17.11",
-                "picomatch": "^2.3.0"
-            },
-            "peerDependencies": {
-                "styled-components": ">= 2"
-            }
-        },
-        "node_modules/babel-plugin-syntax-jsx": {
-            "version": "6.18.0",
-            "resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
-            "integrity": "sha512-qrPaCSo9c8RHNRHIotaufGbuOBN8rtdC4QrrFFc43vyWCCz7Kl7GL1PGaXtMGQZUXrkCjNEgxDfmAuAabr/rlw==",
-            "optional": true,
-            "peer": true
-        },
         "node_modules/babel-preset-current-node-syntax": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/babel-preset-current-node-syntax/-/babel-preset-current-node-syntax-1.0.1.tgz",
@@ -12555,9 +12532,9 @@
             }
         },
         "node_modules/ip": {
-            "version": "1.1.5",
-            "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
-            "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo=",
+            "version": "1.1.9",
+            "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.9.tgz",
+            "integrity": "sha512-cyRxvOEpNHNtchU3Ln9KC/auJgup87llfQpQ+t5ghoC/UhL16SWzbueiCsdTnWmqAWl7LadfuwhlqmtOaqMHdQ==",
             "dev": true
         },
         "node_modules/ipaddr.js": {
@@ -21959,8 +21936,7 @@
         "@babel/plugin-proposal-private-property-in-object": {
             "version": "7.21.0-placeholder-for-preset-env.2",
             "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.0-placeholder-for-preset-env.2.tgz",
-            "integrity": "sha512-SOSkfJDddaM7mak6cPEpswyTRnuRltl429hMraQEglW+OkovnCzsiszTmsrlY//qLFjCpQDFRvjdm2wA5pPm9w==",
-            "requires": {}
+            "integrity": "sha512-SOSkfJDddaM7mak6cPEpswyTRnuRltl429hMraQEglW+OkovnCzsiszTmsrlY//qLFjCpQDFRvjdm2wA5pPm9w=="
         },
         "@babel/plugin-syntax-async-generators": {
             "version": "7.8.4",
@@ -22834,8 +22810,7 @@
             "version": "2.3.1",
             "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.3.1.tgz",
             "integrity": "sha512-xrvsmVUtefWMWQsGgFffqWSK03pZ1vfDki4IVIIUxxDKnGBzqNgv0A7SB1oXtVNEkcVO8xi1ZrTL29HhSu5kGA==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "@csstools/css-tokenizer": {
             "version": "2.2.0",
@@ -22847,15 +22822,13 @@
             "version": "2.1.4",
             "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.4.tgz",
             "integrity": "sha512-V/OUXYX91tAC1CDsiY+HotIcJR+vPtzrX8pCplCpT++i8ThZZsq5F5dzZh/bDM3WUOjrvC1ljed1oSJxMfjqhw==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "@csstools/selector-specificity": {
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-3.0.0.tgz",
             "integrity": "sha512-hBI9tfBtuPIi885ZsZ32IMEU/5nlZH/KOVYJCOh7gyMxaVLGmLedYqFN6Ui1LXkI8JlC8IsuC0rF0btcRZKd5g==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "@develar/schema-utils": {
             "version": "2.6.5",
@@ -23440,8 +23413,7 @@
         "@emotion/use-insertion-effect-with-fallbacks": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.0.0.tgz",
-            "integrity": "sha512-1eEgUGmkaljiBnRMTdksDV1W4kUnmwgp7X9G8B++9GYwl1lUdqSndSriIrTJ0N7LQaoauY9JJ2yhiOYK5+NI4A==",
-            "requires": {}
+            "integrity": "sha512-1eEgUGmkaljiBnRMTdksDV1W4kUnmwgp7X9G8B++9GYwl1lUdqSndSriIrTJ0N7LQaoauY9JJ2yhiOYK5+NI4A=="
         },
         "@emotion/utils": {
             "version": "1.2.0",
@@ -23994,8 +23966,7 @@
         "@mantine/hooks": {
             "version": "6.0.17",
             "resolved": "https://registry.npmjs.org/@mantine/hooks/-/hooks-6.0.17.tgz",
-            "integrity": "sha512-7vf2w1NlzKlUynSuyI2DAIKoEOYKYC8k+tlSsk3BRdbzhbJAiWxcYzJy5seg5dFW1WIpKAZ0wiVdHXf/WRlRgg==",
-            "requires": {}
+            "integrity": "sha512-7vf2w1NlzKlUynSuyI2DAIKoEOYKYC8k+tlSsk3BRdbzhbJAiWxcYzJy5seg5dFW1WIpKAZ0wiVdHXf/WRlRgg=="
         },
         "@mantine/modals": {
             "version": "6.0.17",
@@ -24038,8 +24009,7 @@
         "@mantine/utils": {
             "version": "6.0.17",
             "resolved": "https://registry.npmjs.org/@mantine/utils/-/utils-6.0.17.tgz",
-            "integrity": "sha512-U6SWV/asYE6NhiHx4ltmVZdQR3HwGVqJxVulhOylMcV1tX/P1LMQUCbGV2Oe4O9jbX4/YW5B/CBb4BbEhENQFQ==",
-            "requires": {}
+            "integrity": "sha512-U6SWV/asYE6NhiHx4ltmVZdQR3HwGVqJxVulhOylMcV1tX/P1LMQUCbGV2Oe4O9jbX4/YW5B/CBb4BbEhENQFQ=="
         },
         "@mdn/browser-compat-data": {
             "version": "5.5.10",
@@ -24596,8 +24566,7 @@
         "@ts-rest/core": {
             "version": "3.23.0",
             "resolved": "https://registry.npmjs.org/@ts-rest/core/-/core-3.23.0.tgz",
-            "integrity": "sha512-2vJwa682m9yS/xQPvPxZBluJfIZwNkt2HY9ER3UtGnu8Dijw+8iymSyIyjRLpFFWUyRnVp9IqrEi/d84bkNFIw==",
-            "requires": {}
+            "integrity": "sha512-2vJwa682m9yS/xQPvPxZBluJfIZwNkt2HY9ER3UtGnu8Dijw+8iymSyIyjRLpFFWUyRnVp9IqrEi/d84bkNFIw=="
         },
         "@tsconfig/node10": {
             "version": "1.0.8",
@@ -24965,7 +24934,7 @@
             "version": "15.7.4",
             "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz",
             "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==",
-            "devOptional": true
+            "dev": true
         },
         "@types/qs": {
             "version": "6.9.7",
@@ -24983,7 +24952,7 @@
             "version": "18.0.26",
             "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.26.tgz",
             "integrity": "sha512-hCR3PJQsAIXyxhTNSiDFY//LhnMZWpNNr5etoCqx/iUfGc5gXWtQR2Phl908jVR6uPXacojQWTg4qRpkxTuGug==",
-            "devOptional": true,
+            "dev": true,
             "requires": {
                 "@types/prop-types": "*",
                 "@types/scheduler": "*",
@@ -25055,7 +25024,7 @@
             "version": "0.16.2",
             "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
             "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==",
-            "devOptional": true
+            "dev": true
         },
         "@types/semver": {
             "version": "7.3.13",
@@ -25434,8 +25403,7 @@
             "version": "1.1.1",
             "resolved": "https://registry.npmjs.org/@webpack-cli/configtest/-/configtest-1.1.1.tgz",
             "integrity": "sha512-1FBc1f9G4P/AxMqIgfZgeOTuRnwZMten8E7zap5zgpPInnCrP8D4Q81+4CWIch8i/Nf7nXjP0v6CjjbHOrXhKg==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "@webpack-cli/info": {
             "version": "1.4.1",
@@ -25450,8 +25418,7 @@
             "version": "1.6.1",
             "resolved": "https://registry.npmjs.org/@webpack-cli/serve/-/serve-1.6.1.tgz",
             "integrity": "sha512-gNGTiTrjEVQ0OcVnzsRSqTxaBSr+dmTfm+qJsCDluky8uhdLWep7Gcr62QsAKHTMxjCS/8nEITsmFAhfIx+QSw==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "@xhayper/discord-rpc": {
             "version": "1.0.24",
@@ -25465,8 +25432,7 @@
                 "ws": {
                     "version": "8.14.2",
                     "resolved": "https://registry.npmjs.org/ws/-/ws-8.14.2.tgz",
-                    "integrity": "sha512-wEBG1ftX4jcglPxgFCMJmZ2PLtSbJ2Peg6TmpJFTbe9GZYOQCDPdMYu/Tm0/bGZkw8paZnJY45J4K2PZrLYq8g==",
-                    "requires": {}
+                    "integrity": "sha512-wEBG1ftX4jcglPxgFCMJmZ2PLtSbJ2Peg6TmpJFTbe9GZYOQCDPdMYu/Tm0/bGZkw8paZnJY45J4K2PZrLYq8g=="
                 }
             }
         },
@@ -25544,15 +25510,13 @@
             "version": "1.9.0",
             "resolved": "https://registry.npmjs.org/acorn-import-assertions/-/acorn-import-assertions-1.9.0.tgz",
             "integrity": "sha512-cmMwop9x+8KFhxvKrKfPYmN6/pKTYYHBqLa0DfvVZcKMJWNyWLnaqND7dx/qn66R7ewM1UX5XMaDVP5wlVTaVA==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "acorn-jsx": {
             "version": "5.3.2",
             "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz",
             "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "acorn-walk": {
             "version": "7.2.0",
@@ -25638,8 +25602,7 @@
             "version": "3.5.2",
             "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz",
             "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "ansi-escapes": {
             "version": "4.3.2",
@@ -26082,27 +26045,6 @@
                 "@babel/helper-define-polyfill-provider": "^0.4.2"
             }
         },
-        "babel-plugin-styled-components": {
-            "version": "2.0.7",
-            "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-2.0.7.tgz",
-            "integrity": "sha512-i7YhvPgVqRKfoQ66toiZ06jPNA3p6ierpfUuEWxNF+fV27Uv5gxBkf8KZLHUCc1nFA9j6+80pYoIpqCeyW3/bA==",
-            "optional": true,
-            "peer": true,
-            "requires": {
-                "@babel/helper-annotate-as-pure": "^7.16.0",
-                "@babel/helper-module-imports": "^7.16.0",
-                "babel-plugin-syntax-jsx": "^6.18.0",
-                "lodash": "^4.17.11",
-                "picomatch": "^2.3.0"
-            }
-        },
-        "babel-plugin-syntax-jsx": {
-            "version": "6.18.0",
-            "resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
-            "integrity": "sha512-qrPaCSo9c8RHNRHIotaufGbuOBN8rtdC4QrrFFc43vyWCCz7Kl7GL1PGaXtMGQZUXrkCjNEgxDfmAuAabr/rlw==",
-            "optional": true,
-            "peer": true
-        },
         "babel-preset-current-node-syntax": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/babel-preset-current-node-syntax/-/babel-preset-current-node-syntax-1.0.1.tgz",
@@ -26361,8 +26303,7 @@
             "version": "0.0.3",
             "resolved": "https://registry.npmjs.org/browserslist-config-erb/-/browserslist-config-erb-0.0.3.tgz",
             "integrity": "sha512-y47DryCY92lxkKyRVMlaZvXAolIY7U33q9e4CS0MdWeJkoAht7OzsrkfdZFCBOP3H5q1EVUxS0L7VVsKM6gZCQ==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "bs-logger": {
             "version": "0.2.6",
@@ -27202,8 +27143,7 @@
             "version": "6.2.2",
             "resolved": "https://registry.npmjs.org/css-declaration-sorter/-/css-declaration-sorter-6.2.2.tgz",
             "integrity": "sha512-Ufadglr88ZLsrvS11gjeu/40Lw74D9Am/Jpr3LlYm5Q4ZP5KdlUhG+6u2EjyXeZcxmZ2h1ebCKngDjolpeLHpg==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "css-functions-list": {
             "version": "3.2.0",
@@ -27399,8 +27339,7 @@
             "version": "3.1.0",
             "resolved": "https://registry.npmjs.org/cssnano-utils/-/cssnano-utils-3.1.0.tgz",
             "integrity": "sha512-JQNR19/YZhz4psLX/rQ9M83e3z2Wf/HdJbryzte4a3NSuafyp9w/I4U+hx5C2S9g41qlstH7DEWnZaaj83OuEA==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "csso": {
             "version": "4.2.0",
@@ -28672,8 +28611,7 @@
             "version": "8.8.0",
             "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.8.0.tgz",
             "integrity": "sha512-wLbQiFre3tdGgpDv67NQKnJuTlcUVYHas3k+DZCc2U2BadthoEY4B7hLPvAxaqdyOGCzuLfii2fqGph10va7oA==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "eslint-import-resolver-node": {
             "version": "0.3.7",
@@ -28904,8 +28842,7 @@
             "version": "6.1.1",
             "resolved": "https://registry.npmjs.org/eslint-plugin-promise/-/eslint-plugin-promise-6.1.1.tgz",
             "integrity": "sha512-tjqWDwVZQo7UIPMeDReOpUgHCmCiH+ePnVT+5zVapL0uuHnegBUs2smM13CzOs2Xb5+MHMRFTs9v24yjba4Oig==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "eslint-plugin-react": {
             "version": "7.33.0",
@@ -28962,8 +28899,7 @@
             "version": "4.6.0",
             "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz",
             "integrity": "sha512-oFc7Itz9Qxh2x4gNHStv3BqJq54ExXmfC+a1NjAta66IAN87Wu0R/QArgIS9qKzX3dXKPI9H5crl9QchNMY9+g==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "eslint-plugin-sort-keys-fix": {
             "version": "1.1.2",
@@ -30558,8 +30494,7 @@
             "version": "5.1.0",
             "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz",
             "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "idb-keyval": {
             "version": "6.2.1",
@@ -30704,9 +30639,9 @@
             }
         },
         "ip": {
-            "version": "1.1.5",
-            "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
-            "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo=",
+            "version": "1.1.9",
+            "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.9.tgz",
+            "integrity": "sha512-cyRxvOEpNHNtchU3Ln9KC/auJgup87llfQpQ+t5ghoC/UhL16SWzbueiCsdTnWmqAWl7LadfuwhlqmtOaqMHdQ==",
             "dev": true
         },
         "ipaddr.js": {
@@ -31390,8 +31325,7 @@
             "version": "1.2.2",
             "resolved": "https://registry.npmjs.org/jest-pnp-resolver/-/jest-pnp-resolver-1.2.2.tgz",
             "integrity": "sha512-olV41bKSMm8BdnuMsewT4jqlZ8+3TCARAXjZGT9jcoSnrfUnRCqnMoF9XEeoWjbzObpqF9dRhHQj0Xb9QdF6/w==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "jest-regex-util": {
             "version": "27.5.1",
@@ -32921,8 +32855,7 @@
         "overlayscrollbars-react": {
             "version": "0.5.1",
             "resolved": "https://registry.npmjs.org/overlayscrollbars-react/-/overlayscrollbars-react-0.5.1.tgz",
-            "integrity": "sha512-0xw9J1CT/cQ+ELYy3hudG6nY1H5dgJ1DdVW3d8aZwqx6wyHNZV4nsBQXUxoHmPo3dmlJ5MvOLzpKWA4X6nL4QA==",
-            "requires": {}
+            "integrity": "sha512-0xw9J1CT/cQ+ELYy3hudG6nY1H5dgJ1DdVW3d8aZwqx6wyHNZV4nsBQXUxoHmPo3dmlJ5MvOLzpKWA4X6nL4QA=="
         },
         "p-cancelable": {
             "version": "2.1.1",
@@ -33303,29 +33236,25 @@
             "version": "5.1.1",
             "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-5.1.1.tgz",
             "integrity": "sha512-5JscyFmvkUxz/5/+TB3QTTT9Gi9jHkcn8dcmmuN68JQcv3aQg4y88yEHHhwFB52l/NkaJ43O0dbksGMAo49nfQ==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "postcss-discard-duplicates": {
             "version": "5.1.0",
             "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-5.1.0.tgz",
             "integrity": "sha512-zmX3IoSI2aoenxHV6C7plngHWWhUOV3sP1T8y2ifzxzbtnuhk1EdPwm0S1bIUNaJ2eNbWeGLEwzw8huPD67aQw==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "postcss-discard-empty": {
             "version": "5.1.1",
             "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-5.1.1.tgz",
             "integrity": "sha512-zPz4WljiSuLWsI0ir4Mcnr4qQQ5e1Ukc3i7UfE2XcrwKK2LIPIqE5jxMRxO6GbI3cv//ztXDsXwEWT3BHOGh3A==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "postcss-discard-overridden": {
             "version": "5.1.0",
             "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-5.1.0.tgz",
             "integrity": "sha512-21nOL7RqWR1kasIVdKs8HNqQJhFxLsyRfAnUDm4Fe4t4mCWL9OJiHvlHPjcd8zc5Myu89b/7wZDnOSjFgeWRtw==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "postcss-media-query-parser": {
             "version": "0.2.3",
@@ -33399,8 +33328,7 @@
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz",
             "integrity": "sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "postcss-modules-local-by-default": {
             "version": "4.0.0",
@@ -33435,8 +33363,7 @@
             "version": "5.1.0",
             "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-5.1.0.tgz",
             "integrity": "sha512-mSgUJ+pd/ldRGVx26p2wz9dNZ7ji6Pn8VWBajMXFf8jk7vUoSrZ2lt/wZR7DtlZYKesmZI680qjr2CeFF2fbUg==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "postcss-normalize-display-values": {
             "version": "5.1.0",
@@ -33551,15 +33478,13 @@
             "version": "6.0.0",
             "resolved": "https://registry.npmjs.org/postcss-safe-parser/-/postcss-safe-parser-6.0.0.tgz",
             "integrity": "sha512-FARHN8pwH+WiS2OPCxJI8FuRJpTVnn6ZNFiqAM2aeW2LwTHWWmWgIyKC6cUo0L8aeKiF/14MNvnpls6R2PBeMQ==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "postcss-scss": {
             "version": "4.0.6",
             "resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-4.0.6.tgz",
             "integrity": "sha512-rLDPhJY4z/i4nVFZ27j9GqLxj1pwxE80eAzUNRMXtcpipFYIeowerzBgG3yJhMtObGEXidtIgbUpQ3eLDsf5OQ==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "postcss-selector-parser": {
             "version": "6.0.13",
@@ -33604,8 +33529,7 @@
             "version": "0.36.2",
             "resolved": "https://registry.npmjs.org/postcss-syntax/-/postcss-syntax-0.36.2.tgz",
             "integrity": "sha512-nBRg/i7E3SOHWxF3PpF5WnJM/jQ1YpY9000OaVXlAQj6Zp/kIqJxEDWIZ67tAd7NLuk7zqN4yqe9nc0oNAOs1w==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "postcss-unique-selectors": {
             "version": "5.1.1",
@@ -33950,8 +33874,7 @@
         "react-icons": {
             "version": "4.10.1",
             "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.10.1.tgz",
-            "integrity": "sha512-/ngzDP/77tlCfqthiiGNZeYFACw85fUjZtLbedmJ5DTlNDIwETxhwBzdOJ21zj4iJdvc0J3y7yOsX3PpxAJzrw==",
-            "requires": {}
+            "integrity": "sha512-/ngzDP/77tlCfqthiiGNZeYFACw85fUjZtLbedmJ5DTlNDIwETxhwBzdOJ21zj4iJdvc0J3y7yOsX3PpxAJzrw=="
         },
         "react-is": {
             "version": "17.0.2",
@@ -33988,8 +33911,7 @@
             "version": "2.0.4",
             "resolved": "https://registry.npmjs.org/react-refresh-typescript/-/react-refresh-typescript-2.0.4.tgz",
             "integrity": "sha512-ySsBExEFik5Jjf7NoXtFbzUk2rYWM4gF5gg+wRTNmp9p7B2uMpAAa339FHWqmB8EAr0e6mzzskAXxc0Jd04fBw==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "react-remove-scroll": {
             "version": "2.5.5",
@@ -34042,8 +33964,7 @@
         "react-simple-img": {
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/react-simple-img/-/react-simple-img-3.0.0.tgz",
-            "integrity": "sha512-I0sG/GgY9c+04BgWf1YRlipWBQxR3oG2s/bagU8EO7zals3/Vkfk1PJMeYh/wHfjxJtUmal+y7HWEBm4MzXVsQ==",
-            "requires": {}
+            "integrity": "sha512-I0sG/GgY9c+04BgWf1YRlipWBQxR3oG2s/bagU8EO7zals3/Vkfk1PJMeYh/wHfjxJtUmal+y7HWEBm4MzXVsQ=="
         },
         "react-style-singleton": {
             "version": "2.2.1",
@@ -34098,8 +34019,7 @@
         "react-virtualized-auto-sizer": {
             "version": "1.0.20",
             "resolved": "https://registry.npmjs.org/react-virtualized-auto-sizer/-/react-virtualized-auto-sizer-1.0.20.tgz",
-            "integrity": "sha512-OdIyHwj4S4wyhbKHOKM1wLSj/UDXm839Z3Cvfg2a9j+He6yDa6i5p0qQvEiCnyQlGO/HyfSnigQwuxvYalaAXA==",
-            "requires": {}
+            "integrity": "sha512-OdIyHwj4S4wyhbKHOKM1wLSj/UDXm839Z3Cvfg2a9j+He6yDa6i5p0qQvEiCnyQlGO/HyfSnigQwuxvYalaAXA=="
         },
         "react-window": {
             "version": "1.8.9",
@@ -34120,8 +34040,7 @@
         "react-window-infinite-loader": {
             "version": "1.0.9",
             "resolved": "https://registry.npmjs.org/react-window-infinite-loader/-/react-window-infinite-loader-1.0.9.tgz",
-            "integrity": "sha512-5Hg89IdU4Vrp0RT8kZYKeTIxWZYhNkVXeI1HbKo01Vm/Z7qztDvXljwx16sMzsa9yapRJQW3ODZfMUw38SOWHw==",
-            "requires": {}
+            "integrity": "sha512-5Hg89IdU4Vrp0RT8kZYKeTIxWZYhNkVXeI1HbKo01Vm/Z7qztDvXljwx16sMzsa9yapRJQW3ODZfMUw38SOWHw=="
         },
         "read-config-file": {
             "version": "6.3.2",
@@ -35268,8 +35187,7 @@
             "version": "3.3.1",
             "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-3.3.1.tgz",
             "integrity": "sha512-GPcQ+LDJbrcxHORTRes6Jy2sfvK2kS6hpSfI/fXhPt+spVzxF6LJ1dHLN9zIGmVaaP044YKaIatFaufENRiDoQ==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "style-search": {
             "version": "0.1.0",
@@ -35478,8 +35396,7 @@
                     "version": "8.0.2",
                     "resolved": "https://registry.npmjs.org/postcss-sorting/-/postcss-sorting-8.0.2.tgz",
                     "integrity": "sha512-M9dkSrmU00t/jK7rF6BZSZauA5MAaBW4i5EnJXspMwt4iqTh/L9j6fgMnbElEOfyRyfLfVbIHj/R52zHzAPe1Q==",
-                    "dev": true,
-                    "requires": {}
+                    "dev": true
                 },
                 "stylelint-order": {
                     "version": "6.0.3",
@@ -35497,8 +35414,7 @@
             "version": "13.0.0",
             "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-13.0.0.tgz",
             "integrity": "sha512-EH+yRj6h3GAe/fRiyaoO2F9l9Tgg50AOFhaszyfov9v6ayXJ1IkSHwTxd7lB48FmOeSGDPLjatjO11fJpmarkQ==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "stylelint-config-standard": {
             "version": "34.0.0",
@@ -35534,8 +35450,7 @@
                             "version": "7.0.0",
                             "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-7.0.0.tgz",
                             "integrity": "sha512-yGn84Bf/q41J4luis1AZ95gj0EQwRX8lWmGmBwkwBNSkpGSpl66XcPTulxGa/Z91aPoNGuIGBmFkcM1MejMo9Q==",
-                            "dev": true,
-                            "requires": {}
+                            "dev": true
                         }
                     }
                 },
@@ -35552,8 +35467,7 @@
                             "version": "7.0.0",
                             "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-7.0.0.tgz",
                             "integrity": "sha512-yGn84Bf/q41J4luis1AZ95gj0EQwRX8lWmGmBwkwBNSkpGSpl66XcPTulxGa/Z91aPoNGuIGBmFkcM1MejMo9Q==",
-                            "dev": true,
-                            "requires": {}
+                            "dev": true
                         }
                     }
                 }
@@ -36272,8 +36186,7 @@
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/typescript-plugin-styled-components/-/typescript-plugin-styled-components-3.0.0.tgz",
             "integrity": "sha512-QWlhTl6NqsFxtJyxn7pJjm3RhgzXSByUftZ3AoQClrMMpa4yAaHuJKTN1gFpH3Ti+Rwm56fNUfG9pXSBU+WW3A==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "unbox-primitive": {
             "version": "1.0.2",
@@ -36429,14 +36342,12 @@
         "use-composed-ref": {
             "version": "1.3.0",
             "resolved": "https://registry.npmjs.org/use-composed-ref/-/use-composed-ref-1.3.0.tgz",
-            "integrity": "sha512-GLMG0Jc/jiKov/3Ulid1wbv3r54K9HlMW29IWcDFPEqFkSO2nS0MuefWgMJpeHQ9YJeXDL3ZUF+P3jdXlZX/cQ==",
-            "requires": {}
+            "integrity": "sha512-GLMG0Jc/jiKov/3Ulid1wbv3r54K9HlMW29IWcDFPEqFkSO2nS0MuefWgMJpeHQ9YJeXDL3ZUF+P3jdXlZX/cQ=="
         },
         "use-isomorphic-layout-effect": {
             "version": "1.1.2",
             "resolved": "https://registry.npmjs.org/use-isomorphic-layout-effect/-/use-isomorphic-layout-effect-1.1.2.tgz",
-            "integrity": "sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA==",
-            "requires": {}
+            "integrity": "sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA=="
         },
         "use-latest": {
             "version": "1.2.1",
@@ -36458,8 +36369,7 @@
         "use-sync-external-store": {
             "version": "1.2.0",
             "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz",
-            "integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==",
-            "requires": {}
+            "integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA=="
         },
         "utf8-byte-length": {
             "version": "1.0.4",
@@ -36987,8 +36897,7 @@
                     "version": "8.5.0",
                     "resolved": "https://registry.npmjs.org/ws/-/ws-8.5.0.tgz",
                     "integrity": "sha512-BWX0SWVgLPzYwF8lTzEy1egjhS4S4OEAHfsO8o65WOVsrnSRGaSiUaa9e0ggGlkMTtBlmOpEXiie9RUcBO86qg==",
-                    "dev": true,
-                    "requires": {}
+                    "dev": true
                 }
             }
         },
@@ -37137,8 +37046,7 @@
             "version": "7.5.7",
             "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.7.tgz",
             "integrity": "sha512-KMvVuFzpKBuiIXW3E4u3mySRO2/mCHSyZDJQM5NQ9Q9KHWHWh0NHgfbRMLLrceUK5qAL4ytALJbpRMjixFZh8A==",
-            "dev": true,
-            "requires": {}
+            "dev": true
         },
         "xml-name-validator": {
             "version": "3.0.0",
diff --git a/package.json b/package.json
index 7be6527b..dfe340cf 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
         "build:remote": "cross-env NODE_ENV=production TS_NODE_TRANSPILE_ONLY=true webpack --config ./.erb/configs/webpack.config.remote.prod.ts",
         "build:renderer": "cross-env NODE_ENV=production TS_NODE_TRANSPILE_ONLY=true webpack --config ./.erb/configs/webpack.config.renderer.prod.ts",
         "build:web": "cross-env NODE_ENV=production TS_NODE_TRANSPILE_ONLY=true webpack --config ./.erb/configs/webpack.config.web.prod.ts",
-        "build:docker": "npm run build:web && docker build -t jeffvli/feishin .",
+        "build:docker": "docker build -t jeffvli/feishin .",
         "rebuild": "electron-rebuild --parallel --types prod,dev,optional --module-dir release/app",
         "lint": "concurrently \"npm run lint:code\" \"npm run lint:styles\"",
         "lint:code": "cross-env NODE_ENV=development eslint . --ext .js,.jsx,.ts,.tsx --fix",
@@ -345,6 +345,7 @@
         "react-virtualized-auto-sizer": "^1.0.17",
         "react-window": "^1.8.9",
         "react-window-infinite-loader": "^1.0.9",
+        "semver": "^7.5.4",
         "styled-components": "^6.0.8",
         "swiper": "^9.3.1",
         "zod": "^3.22.3",
diff --git a/release/app/package-lock.json b/release/app/package-lock.json
index 11e7b9ad..763d962e 100644
--- a/release/app/package-lock.json
+++ b/release/app/package-lock.json
@@ -2293,8 +2293,7 @@
         "ws": {
             "version": "8.13.0",
             "resolved": "https://registry.npmjs.org/ws/-/ws-8.13.0.tgz",
-            "integrity": "sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA==",
-            "requires": {}
+            "integrity": "sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA=="
         },
         "xml2js": {
             "version": "0.4.23",
diff --git a/settings.js.template b/settings.js.template
new file mode 100644
index 00000000..782f0d7e
--- /dev/null
+++ b/settings.js.template
@@ -0,0 +1 @@
+"use strict";window.SERVER_URL="${SERVER_URL}";window.SERVER_NAME="${SERVER_NAME}";window.SERVER_TYPE="${SERVER_TYPE}";window.SERVER_LOCK=${SERVER_LOCK};
diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
index 34b77a0b..fbede376 100644
--- a/src/i18n/locales/en.json
+++ b/src/i18n/locales/en.json
@@ -38,6 +38,7 @@
         "channel_other": "channels",
         "clear": "clear",
         "close": "close",
+        "codec": "codec",
         "collapse": "collapse",
         "comingSoon": "coming soon…",
         "configure": "configure",
@@ -363,6 +364,7 @@
             "playlists": "$t(entity.playlist_other)",
             "search": "$t(common.search)",
             "settings": "$t(common.setting_other)",
+            "shared": "shared $t(entity.playlist_other)",
             "tracks": "$t(entity.track_other)"
         },
         "trackList": {
@@ -567,6 +569,8 @@
         "skipDuration_description": "sets the duration to skip when using the skip buttons on the player bar",
         "skipPlaylistPage": "skip playlist page",
         "skipPlaylistPage_description": "when navigating to a playlist, go to the playlist song list page instead of the default page",
+        "startMinimized": "start minimized",
+        "startMinimized_description": "start the application in system tray",
         "theme": "theme",
         "theme_description": "sets the theme to use for the application",
         "themeDark": "theme (dark)",
@@ -592,6 +596,7 @@
             "bitrate": "bitrate",
             "bpm": "bpm",
             "channels": "$t(common.channel_other)",
+            "codec": "$t(common.codec)",
             "comment": "comment",
             "dateAdded": "date added",
             "discNumber": "disc",
@@ -626,6 +631,7 @@
                 "bitrate": "$t(common.bitrate)",
                 "bpm": "$t(common.bpm)",
                 "channels": "$t(common.channel_other)",
+                "codec": "$t(common.codec)",
                 "dateAdded": "date added",
                 "discNumber": "disc number",
                 "duration": "$t(common.duration)",
diff --git a/src/main/main.ts b/src/main/main.ts
index d87aaf36..107c6562 100644
--- a/src/main/main.ts
+++ b/src/main/main.ts
@@ -206,7 +206,7 @@ const createTray = () => {
     tray.setContextMenu(contextMenu);
 };
 
-const createWindow = async () => {
+const createWindow = async (first = true) => {
     if (isDevelopment) {
         await installExtensions();
     }
@@ -350,13 +350,14 @@ const createWindow = async () => {
 
     mainWindow.loadURL(resolveHtmlPath('index.html'));
 
+    const startWindowMinimized = store.get('window_start_minimized', false) as boolean;
+
     mainWindow.on('ready-to-show', () => {
         if (!mainWindow) {
             throw new Error('"mainWindow" is not defined');
         }
-        if (process.env.START_MINIMIZED) {
-            mainWindow.minimize();
-        } else {
+
+        if (!first || !startWindowMinimized) {
             mainWindow.show();
             createWinThumbarButtons();
         }
@@ -608,7 +609,11 @@ if (!singleInstance) {
             app.on('activate', () => {
                 // On macOS it's common to re-create a window in the app when the
                 // dock icon is clicked and there are no other windows open.
-                if (mainWindow === null) createWindow();
+                if (mainWindow === null) createWindow(false);
+                else if (!mainWindow.isVisible()) {
+                    mainWindow.show();
+                    createWinThumbarButtons();
+                }
             });
         })
         .catch(console.log);
diff --git a/src/main/preload/local-settings.ts b/src/main/preload/local-settings.ts
index b8aafba0..c6269411 100644
--- a/src/main/preload/local-settings.ts
+++ b/src/main/preload/local-settings.ts
@@ -1,6 +1,6 @@
 import { IpcRendererEvent, ipcRenderer, webFrame } from 'electron';
 import Store from 'electron-store';
-import type { TitleTheme } from '/@/renderer/types';
+import { toServerType, type TitleTheme } from '/@/renderer/types';
 
 const store = new Store();
 
@@ -56,9 +56,20 @@ const themeSet = (theme: TitleTheme): void => {
     ipcRenderer.send('theme-set', theme);
 };
 
+const SERVER_TYPE = toServerType(process.env.SERVER_TYPE);
+
+const env = {
+    SERVER_LOCK:
+        SERVER_TYPE !== null ? process.env.SERVER_LOCK?.toLocaleLowerCase() === 'true' : false,
+    SERVER_NAME: process.env.SERVER_NAME ?? '',
+    SERVER_TYPE,
+    SERVER_URL: process.env.SERVER_URL ?? 'http://',
+};
+
 export const localSettings = {
     disableMediaKeys,
     enableMediaKeys,
+    env,
     fontError,
     get,
     passwordGet,
diff --git a/src/renderer/api/controller.ts b/src/renderer/api/controller.ts
index 05961b1e..de76e721 100644
--- a/src/renderer/api/controller.ts
+++ b/src/renderer/api/controller.ts
@@ -54,8 +54,8 @@ import type {
     StructuredLyric,
     SimilarSongsArgs,
     Song,
+    ServerType,
 } from '/@/renderer/api/types';
-import { ServerType } from '/@/renderer/types';
 import { DeletePlaylistResponse, RandomSongListArgs } from './types';
 import { ndController } from '/@/renderer/api/navidrome/navidrome-controller';
 import { ssController } from '/@/renderer/api/subsonic/subsonic-controller';
@@ -177,7 +177,7 @@ const endpoints: ApiController = {
         getPlaylistList: ndController.getPlaylistList,
         getPlaylistSongList: ndController.getPlaylistSongList,
         getRandomSongList: ssController.getRandomSongList,
-        getServerInfo: ssController.getServerInfo,
+        getServerInfo: ndController.getServerInfo,
         getSimilarSongs: ssController.getSimilarSongs,
         getSongDetail: ndController.getSongDetail,
         getSongList: ndController.getSongList,
diff --git a/src/renderer/api/features.types.ts b/src/renderer/api/features.types.ts
new file mode 100644
index 00000000..be5606a5
--- /dev/null
+++ b/src/renderer/api/features.types.ts
@@ -0,0 +1,6 @@
+export enum ServerFeature {
+    SMART_PLAYLISTS = 'smartPlaylists',
+    SONG_LYRICS = 'songLyrics',
+}
+
+export type ServerFeatures = Record<Partial<ServerFeature>, boolean>;
diff --git a/src/renderer/api/jellyfin/jellyfin-api.ts b/src/renderer/api/jellyfin/jellyfin-api.ts
index 7b64f85c..ed9a538e 100644
--- a/src/renderer/api/jellyfin/jellyfin-api.ts
+++ b/src/renderer/api/jellyfin/jellyfin-api.ts
@@ -3,7 +3,7 @@ import { jfType } from '/@/renderer/api/jellyfin/jellyfin-types';
 import { initClient, initContract } from '@ts-rest/core';
 import axios, { AxiosError, AxiosResponse, isAxiosError, Method } from 'axios';
 import qs from 'qs';
-import { ServerListItem } from '/@/renderer/types';
+import { ServerListItem } from '/@/renderer/api/types';
 import omitBy from 'lodash/omitBy';
 import { z } from 'zod';
 import { authenticationFailure } from '/@/renderer/api/utils';
diff --git a/src/renderer/api/jellyfin/jellyfin-controller.ts b/src/renderer/api/jellyfin/jellyfin-controller.ts
index cddb0158..6ef4a7c9 100644
--- a/src/renderer/api/jellyfin/jellyfin-controller.ts
+++ b/src/renderer/api/jellyfin/jellyfin-controller.ts
@@ -61,6 +61,7 @@ import packageJson from '../../../../package.json';
 import { z } from 'zod';
 import { JFSongListSort, JFSortOrder } from '/@/renderer/api/jellyfin.types';
 import isElectron from 'is-electron';
+import { ServerFeatures } from '/@/renderer/api/features.types';
 
 const formatCommaDelimitedString = (value: string[]) => {
     return value.join(',');
@@ -959,7 +960,16 @@ const getServerInfo = async (args: ServerInfoArgs): Promise<ServerInfo> => {
         throw new Error('Failed to get server info');
     }
 
-    return { id: apiClientProps.server?.id, version: res.body.Version };
+    const features: ServerFeatures = {
+        smartPlaylists: false,
+        songLyrics: true,
+    };
+
+    return {
+        features,
+        id: apiClientProps.server?.id,
+        version: res.body.Version,
+    };
 };
 
 const getSimilarSongs = async (args: SimilarSongsArgs): Promise<Song[]> => {
diff --git a/src/renderer/api/jellyfin/jellyfin-normalize.ts b/src/renderer/api/jellyfin/jellyfin-normalize.ts
index a351d6c9..08d29a2d 100644
--- a/src/renderer/api/jellyfin/jellyfin-normalize.ts
+++ b/src/renderer/api/jellyfin/jellyfin-normalize.ts
@@ -10,8 +10,9 @@ import {
     Playlist,
     MusicFolder,
     Genre,
+    ServerListItem,
+    ServerType,
 } from '/@/renderer/api/types';
-import { ServerListItem, ServerType } from '/@/renderer/types';
 
 const getStreamUrl = (args: {
     container?: string;
diff --git a/src/renderer/api/jellyfin/jellyfin-types.ts b/src/renderer/api/jellyfin/jellyfin-types.ts
index 9b9e5333..683a2eac 100644
--- a/src/renderer/api/jellyfin/jellyfin-types.ts
+++ b/src/renderer/api/jellyfin/jellyfin-types.ts
@@ -675,6 +675,10 @@ const similarSongs = pagination.extend({
     Items: z.array(song),
 });
 
+export enum JellyfinExtensions {
+    SONG_LYRICS = 'songLyrics',
+}
+
 export const jfType = {
     _enum: {
         albumArtistList: albumArtistListSort,
diff --git a/src/renderer/api/navidrome/navidrome-api.ts b/src/renderer/api/navidrome/navidrome-api.ts
index 04cef24a..e15e3aa2 100644
--- a/src/renderer/api/navidrome/navidrome-api.ts
+++ b/src/renderer/api/navidrome/navidrome-api.ts
@@ -7,7 +7,7 @@ import qs from 'qs';
 import { ndType } from './navidrome-types';
 import { authenticationFailure, resultWithHeaders } from '/@/renderer/api/utils';
 import { useAuthStore } from '/@/renderer/store';
-import { ServerListItem } from '/@/renderer/types';
+import { ServerListItem } from '/@/renderer/api/types';
 import { toast } from '/@/renderer/components';
 import i18n from '/@/i18n/i18n';
 
diff --git a/src/renderer/api/navidrome/navidrome-controller.ts b/src/renderer/api/navidrome/navidrome-controller.ts
index 486cb1bc..a3fd3a8d 100644
--- a/src/renderer/api/navidrome/navidrome-controller.ts
+++ b/src/renderer/api/navidrome/navidrome-controller.ts
@@ -1,3 +1,9 @@
+import { ndApiClient } from '/@/renderer/api/navidrome/navidrome-api';
+import { ndNormalize } from '/@/renderer/api/navidrome/navidrome-normalize';
+import { NavidromeExtensions, ndType } from '/@/renderer/api/navidrome/navidrome-types';
+import { ssApiClient } from '/@/renderer/api/subsonic/subsonic-api';
+import semverCoerce from 'semver/functions/coerce';
+import semverGte from 'semver/functions/gte';
 import {
     AlbumArtistDetailArgs,
     AlbumArtistDetailResponse,
@@ -39,11 +45,11 @@ import {
     RemoveFromPlaylistResponse,
     RemoveFromPlaylistArgs,
     genreListSortMap,
+    ServerInfo,
+    ServerInfoArgs,
 } from '../types';
-import { ndApiClient } from '/@/renderer/api/navidrome/navidrome-api';
-import { ndNormalize } from '/@/renderer/api/navidrome/navidrome-normalize';
-import { ndType } from '/@/renderer/api/navidrome/navidrome-types';
-import { ssApiClient } from '/@/renderer/api/subsonic/subsonic-api';
+import { hasFeature } from '/@/renderer/api/utils';
+import { ServerFeature, ServerFeatures } from '/@/renderer/api/features.types';
 
 const authenticate = async (
     url: string,
@@ -355,6 +361,16 @@ const deletePlaylist = async (args: DeletePlaylistArgs): Promise<DeletePlaylistR
 
 const getPlaylistList = async (args: PlaylistListArgs): Promise<PlaylistListResponse> => {
     const { query, apiClientProps } = args;
+    const customQuery = query._custom?.navidrome;
+
+    // Smart playlists only became available in 0.48.0. Do not filter for previous versions
+    if (
+        customQuery &&
+        customQuery.smart !== undefined &&
+        !hasFeature(apiClientProps.server, ServerFeature.SMART_PLAYLISTS)
+    ) {
+        customQuery.smart = undefined;
+    }
 
     const res = await ndApiClient(apiClientProps).getPlaylistList({
         query: {
@@ -363,7 +379,7 @@ const getPlaylistList = async (args: PlaylistListArgs): Promise<PlaylistListResp
             _sort: query.sortBy ? playlistListSortMap.navidrome[query.sortBy] : undefined,
             _start: query.startIndex,
             q: query.searchTerm,
-            ...query._custom?.navidrome,
+            ...customQuery,
         },
     });
 
@@ -465,6 +481,70 @@ const removeFromPlaylist = async (
     return null;
 };
 
+const VERSION_INFO: Array<[string, Record<string, number[]>]> = [
+    ['0.48.0', { [ServerFeature.SMART_PLAYLISTS]: [1] }],
+];
+
+const getFeatures = (version: string): Record<string, number[]> => {
+    const cleanVersion = semverCoerce(version);
+    const features: Record<string, number[]> = {};
+    let matched = cleanVersion === null;
+
+    for (const [version, supportedFeatures] of VERSION_INFO) {
+        if (!matched) {
+            matched = semverGte(cleanVersion!, version);
+        }
+
+        if (matched) {
+            for (const [feature, feat] of Object.entries(supportedFeatures)) {
+                if (feature in features) {
+                    features[feature].push(...feat);
+                } else {
+                    features[feature] = feat;
+                }
+            }
+        }
+    }
+
+    return features;
+};
+
+const getServerInfo = async (args: ServerInfoArgs): Promise<ServerInfo> => {
+    const { apiClientProps } = args;
+
+    // Navidrome will always populate serverVersion
+    const ping = await ssApiClient(apiClientProps).ping();
+
+    if (ping.status !== 200) {
+        throw new Error('Failed to ping server');
+    }
+
+    const navidromeFeatures: Record<string, number[]> = getFeatures(ping.body.serverVersion!);
+
+    if (ping.body.openSubsonic) {
+        const res = await ssApiClient(apiClientProps).getServerInfo();
+
+        if (res.status !== 200) {
+            throw new Error('Failed to get server extensions');
+        }
+
+        for (const extension of res.body.openSubsonicExtensions) {
+            navidromeFeatures[extension.name] = extension.versions;
+        }
+    }
+
+    const features: ServerFeatures = {
+        smartPlaylists: false,
+        songLyrics: true,
+    };
+
+    if (navidromeFeatures[NavidromeExtensions.SMART_PLAYLISTS]) {
+        features[ServerFeature.SMART_PLAYLISTS] = true;
+    }
+
+    return { features, id: apiClientProps.server?.id, version: ping.body.serverVersion! };
+};
+
 export const ndController = {
     addToPlaylist,
     authenticate,
@@ -478,6 +558,7 @@ export const ndController = {
     getPlaylistDetail,
     getPlaylistList,
     getPlaylistSongList,
+    getServerInfo,
     getSongDetail,
     getSongList,
     getUserList,
diff --git a/src/renderer/api/navidrome/navidrome-normalize.ts b/src/renderer/api/navidrome/navidrome-normalize.ts
index 8f07093e..9f69b9e1 100644
--- a/src/renderer/api/navidrome/navidrome-normalize.ts
+++ b/src/renderer/api/navidrome/navidrome-normalize.ts
@@ -7,8 +7,9 @@ import {
     User,
     AlbumArtist,
     Genre,
+    ServerListItem,
+    ServerType,
 } from '/@/renderer/api/types';
-import { ServerListItem, ServerType } from '/@/renderer/types';
 import z from 'zod';
 import { ndType } from './navidrome-types';
 import { ssType } from '/@/renderer/api/subsonic/subsonic-types';
diff --git a/src/renderer/api/navidrome/navidrome-types.ts b/src/renderer/api/navidrome/navidrome-types.ts
index b63b5442..6165046a 100644
--- a/src/renderer/api/navidrome/navidrome-types.ts
+++ b/src/renderer/api/navidrome/navidrome-types.ts
@@ -343,6 +343,10 @@ const removeFromPlaylistParameters = z.object({
     id: z.array(z.string()),
 });
 
+export enum NavidromeExtensions {
+    SMART_PLAYLISTS = 'smartPlaylists',
+}
+
 export const ndType = {
     _enum: {
         albumArtistList: ndAlbumArtistListSort,
diff --git a/src/renderer/api/subsonic/subsonic-controller.ts b/src/renderer/api/subsonic/subsonic-controller.ts
index 75e3435e..7611f0e2 100644
--- a/src/renderer/api/subsonic/subsonic-controller.ts
+++ b/src/renderer/api/subsonic/subsonic-controller.ts
@@ -2,7 +2,7 @@ import md5 from 'md5';
 import { z } from 'zod';
 import { ssApiClient } from '/@/renderer/api/subsonic/subsonic-api';
 import { ssNormalize } from '/@/renderer/api/subsonic/subsonic-normalize';
-import { ssType } from '/@/renderer/api/subsonic/subsonic-types';
+import { SubsonicExtensions, ssType } from '/@/renderer/api/subsonic/subsonic-types';
 import {
     ArtistInfoArgs,
     AuthenticationResponse,
@@ -29,6 +29,7 @@ import {
     Song,
 } from '/@/renderer/api/types';
 import { randomString } from '/@/renderer/utils';
+import { ServerFeatures } from '/@/renderer/api/features.types';
 
 const authenticate = async (
     url: string,
@@ -383,8 +384,13 @@ const getServerInfo = async (args: ServerInfoArgs): Promise<ServerInfo> => {
         throw new Error('Failed to ping server');
     }
 
+    const features: ServerFeatures = {
+        smartPlaylists: false,
+        songLyrics: false,
+    };
+
     if (!ping.body.openSubsonic || !ping.body.serverVersion) {
-        return { version: ping.body.version };
+        return { features, version: ping.body.version };
     }
 
     const res = await ssApiClient(apiClientProps).getServerInfo();
@@ -393,9 +399,13 @@ const getServerInfo = async (args: ServerInfoArgs): Promise<ServerInfo> => {
         throw new Error('Failed to get server extensions');
     }
 
-    const features: Record<string, number[]> = {};
+    const subsonicFeatures: Record<string, number[]> = {};
     for (const extension of res.body.openSubsonicExtensions) {
-        features[extension.name] = extension.versions;
+        subsonicFeatures[extension.name] = extension.versions;
+    }
+
+    if (subsonicFeatures[SubsonicExtensions.SONG_LYRICS]) {
+        features.songLyrics = true;
     }
 
     return { features, id: apiClientProps.server?.id, version: ping.body.serverVersion };
diff --git a/src/renderer/api/subsonic/subsonic-normalize.ts b/src/renderer/api/subsonic/subsonic-normalize.ts
index 58c30026..a775eb3d 100644
--- a/src/renderer/api/subsonic/subsonic-normalize.ts
+++ b/src/renderer/api/subsonic/subsonic-normalize.ts
@@ -1,8 +1,14 @@
 import { nanoid } from 'nanoid';
 import { z } from 'zod';
 import { ssType } from '/@/renderer/api/subsonic/subsonic-types';
-import { QueueSong, LibraryItem, AlbumArtist, Album } from '/@/renderer/api/types';
-import { ServerListItem, ServerType } from '/@/renderer/types';
+import {
+    QueueSong,
+    LibraryItem,
+    AlbumArtist,
+    Album,
+    ServerListItem,
+    ServerType,
+} from '/@/renderer/api/types';
 
 const getCoverArtUrl = (args: {
     baseUrl: string | undefined;
diff --git a/src/renderer/api/subsonic/subsonic-types.ts b/src/renderer/api/subsonic/subsonic-types.ts
index a9ff3125..50bbdbf2 100644
--- a/src/renderer/api/subsonic/subsonic-types.ts
+++ b/src/renderer/api/subsonic/subsonic-types.ts
@@ -260,6 +260,13 @@ const similarSongs = z.object({
         .optional(),
 });
 
+export enum SubsonicExtensions {
+    FORM_POST = 'formPost',
+    SONG_LYRICS = 'songLyrics',
+    TRANSCODE_OFFSET = 'transcodeOffset',
+}
+
+
 export const ssType = {
     _parameters: {
         albumList: albumListParameters,
diff --git a/src/renderer/api/types.ts b/src/renderer/api/types.ts
index c4e3c515..f3e637a2 100644
--- a/src/renderer/api/types.ts
+++ b/src/renderer/api/types.ts
@@ -20,6 +20,7 @@ import {
     NDUserListSort,
     NDGenreListSort,
 } from './navidrome.types';
+import { ServerFeatures } from '/@/renderer/api/features.types';
 
 export enum LibraryItem {
     ALBUM = 'album',
@@ -57,13 +58,16 @@ export type User = {
 
 export type ServerListItem = {
     credential: string;
+    features?: ServerFeatures;
     id: string;
     name: string;
     ndCredential?: string;
+    savePassword?: boolean;
     type: ServerType;
     url: string;
     userId: string | null;
     username: string;
+    version?: string;
 };
 
 export enum ServerType {
@@ -1141,14 +1145,8 @@ export type FontData = {
 
 export type ServerInfoArgs = BaseEndpointArgs;
 
-export enum SubsonicExtensions {
-    FORM_POST = 'formPost',
-    SONG_LYRICS = 'songLyrics',
-    TRANSCODE_OFFSET = 'transcodeOffset',
-}
-
 export type ServerInfo = {
-    features?: Record<string, number[]>;
+    features: ServerFeatures;
     id?: string;
     version: string;
 };
diff --git a/src/renderer/api/utils.ts b/src/renderer/api/utils.ts
index 0063fae9..9e209591 100644
--- a/src/renderer/api/utils.ts
+++ b/src/renderer/api/utils.ts
@@ -2,7 +2,8 @@ import { AxiosHeaders } from 'axios';
 import { z } from 'zod';
 import { toast } from '/@/renderer/components';
 import { useAuthStore } from '/@/renderer/store';
-import { ServerListItem } from '/@/renderer/types';
+import { ServerListItem } from '/@/renderer/api/types';
+import { ServerFeature } from '/@/renderer/api/features.types';
 
 // Since ts-rest client returns a strict response type, we need to add the headers to the body object
 export const resultWithHeaders = <ItemType extends z.ZodTypeAny>(itemSchema: ItemType) => {
@@ -38,3 +39,11 @@ export const authenticationFailure = (currentServer: ServerListItem | null) => {
         useAuthStore.getState().actions.setCurrentServer(null);
     }
 };
+
+export const hasFeature = (server: ServerListItem | null, feature: ServerFeature): boolean => {
+    if (!server || !server.features) {
+        return false;
+    }
+
+    return server.features[feature];
+};
diff --git a/src/renderer/components/grid-carousel/index.tsx b/src/renderer/components/grid-carousel/index.tsx
index 2f31aae5..8ae02e66 100644
--- a/src/renderer/components/grid-carousel/index.tsx
+++ b/src/renderer/components/grid-carousel/index.tsx
@@ -4,6 +4,7 @@ import {
     ReactNode,
     useCallback,
     useEffect,
+    useLayoutEffect,
     useMemo,
     useRef,
     useState,
@@ -114,9 +115,11 @@ export const SwiperGridCarousel = ({
     isLoading,
     uniqueId,
 }: SwiperGridCarouselProps) => {
+    const containerRef = useRef<HTMLDivElement>(null);
     const swiperRef = useRef<SwiperCore | any>(null);
     const playButtonBehavior = usePlayButtonBehavior();
     const handlePlayQueueAdd = usePlayQueueAdd();
+    const [slideCount, setSlideCount] = useState(4);
 
     useEffect(() => {
         swiperRef.current?.slideTo(0, 0);
@@ -191,23 +194,24 @@ export const SwiperGridCarousel = ({
 
     const handleNext = useCallback(() => {
         const activeIndex = swiperRef?.current?.activeIndex || 0;
-        const slidesPerView = Math.round(Number(swiperProps?.slidesPerView || 4));
+        const slidesPerView = Math.round(Number(swiperProps?.slidesPerView || slideCount));
         swiperRef?.current?.slideTo(activeIndex + slidesPerView);
-    }, [swiperProps?.slidesPerView]);
+    }, [slideCount, swiperProps?.slidesPerView]);
 
     const handlePrev = useCallback(() => {
         const activeIndex = swiperRef?.current?.activeIndex || 0;
-        const slidesPerView = Math.round(Number(swiperProps?.slidesPerView || 4));
+        const slidesPerView = Math.round(Number(swiperProps?.slidesPerView || slideCount));
         swiperRef?.current?.slideTo(activeIndex - slidesPerView);
-    }, [swiperProps?.slidesPerView]);
+    }, [slideCount, swiperProps?.slidesPerView]);
 
     const handleOnSlideChange = useCallback((e: SwiperCore) => {
         const { slides, isEnd, isBeginning, params } = e;
         if (isEnd || isBeginning) return;
 
+        const slideCount = (params.slidesPerView as number | undefined) || 4;
         setPagination({
-            hasNextPage: (params?.slidesPerView || 4) < slides.length,
-            hasPreviousPage: (params?.slidesPerView || 4) < slides.length,
+            hasNextPage: slideCount < slides.length,
+            hasPreviousPage: slideCount < slides.length,
         });
     }, []);
 
@@ -215,82 +219,106 @@ export const SwiperGridCarousel = ({
         const { slides, isEnd, isBeginning, params } = e;
         if (isEnd || isBeginning) return;
 
+        const slideCount = (params.slidesPerView as number | undefined) || 4;
         setPagination({
-            hasNextPage: (params.slidesPerView || 4) < slides.length,
-            hasPreviousPage: (params.slidesPerView || 4) < slides.length,
+            hasNextPage: slideCount < slides.length,
+            hasPreviousPage: slideCount < slides.length,
         });
     }, []);
 
     const handleOnReachEnd = useCallback((e: SwiperCore) => {
         const { slides, params } = e;
 
+        const slideCount = (params.slidesPerView as number | undefined) || 4;
         setPagination({
             hasNextPage: false,
-            hasPreviousPage: (params.slidesPerView || 4) < slides.length,
+            hasPreviousPage: slideCount < slides.length,
         });
     }, []);
 
     const handleOnReachBeginning = useCallback((e: SwiperCore) => {
         const { slides, params } = e;
 
+        const slideCount = (params.slidesPerView as number | undefined) || 4;
         setPagination({
-            hasNextPage: (params.slidesPerView || 4) < slides.length,
+            hasNextPage: slideCount < slides.length,
             hasPreviousPage: false,
         });
     }, []);
 
-    const handleOnResize = useCallback((e: SwiperCore) => {
-        if (!e) return;
-        const { width } = e;
-        const slidesPerView = getSlidesPerView(width);
-        if (!e.params) return;
-        e.params.slidesPerView = slidesPerView;
-    }, []);
+    useLayoutEffect(() => {
+        const handleResize = () => {
+            // Use the container div ref and not swiper width, as this value is more accurate
+            const width = containerRef.current?.clientWidth;
+            const { activeIndex, params, slides } =
+                (swiperRef.current as SwiperCore | undefined) ?? {};
 
-    const throttledOnResize = throttle(handleOnResize, 200);
+            if (width) {
+                const slidesPerView = getSlidesPerView(width);
+                setSlideCount(slidesPerView);
+            }
+
+            if (activeIndex !== undefined && slides && params?.slidesPerView) {
+                const slideCount = (params.slidesPerView as number | undefined) || 4;
+                setPagination({
+                    hasNextPage: activeIndex + slideCount < slides.length,
+                    hasPreviousPage: activeIndex > 0,
+                });
+            }
+        };
+
+        handleResize();
+
+        const throttledResize = throttle(handleResize, 200);
+        window.addEventListener('resize', throttledResize);
+
+        return () => {
+            window.removeEventListener('resize', throttledResize);
+        };
+    }, []);
 
     return (
         <CarouselContainer
             className="grid-carousel"
             spacing="md"
         >
-            {title ? (
-                <Title
-                    {...title}
-                    handleNext={handleNext}
-                    handlePrev={handlePrev}
-                    pagination={pagination}
-                />
-            ) : null}
-            <Swiper
-                ref={swiperRef}
-                resizeObserver
-                modules={[Virtual]}
-                slidesPerView={4}
-                spaceBetween={20}
-                style={{ height: '100%', width: '100%' }}
-                onBeforeInit={(swiper) => {
-                    swiperRef.current = swiper;
-                }}
-                onBeforeResize={handleOnResize}
-                onReachBeginning={handleOnReachBeginning}
-                onReachEnd={handleOnReachEnd}
-                onResize={throttledOnResize}
-                onSlideChange={handleOnSlideChange}
-                onZoomChange={handleOnZoomChange}
-                {...swiperProps}
-            >
-                {slides.map((slideContent, index) => {
-                    return (
-                        <SwiperSlide
-                            key={`${uniqueId}-${slideContent?.props?.data?.id}-${index}`}
-                            virtualIndex={index}
-                        >
-                            {slideContent}
-                        </SwiperSlide>
-                    );
-                })}
-            </Swiper>
+            <div ref={containerRef}>
+                {title ? (
+                    <Title
+                        {...title}
+                        handleNext={handleNext}
+                        handlePrev={handlePrev}
+                        pagination={pagination}
+                    />
+                ) : null}
+                <Swiper
+                    ref={swiperRef}
+                    resizeObserver
+                    modules={[Virtual]}
+                    slidesPerView={slideCount}
+                    spaceBetween={20}
+                    style={{ height: '100%', width: '100%' }}
+                    onBeforeInit={(swiper) => {
+                        swiperRef.current = swiper;
+                    }}
+                    onReachBeginning={handleOnReachBeginning}
+                    onReachEnd={handleOnReachEnd}
+                    onSlideChange={handleOnSlideChange}
+                    onZoomChange={handleOnZoomChange}
+                    {...swiperProps}
+                >
+                    {slides.map((slideContent, index) => {
+                        return (
+                            <SwiperSlide
+                                key={`${uniqueId}-${slideContent?.props?.data?.id}-${index}`}
+                                virtualIndex={index}
+                            >
+                                {slideContent}
+                            </SwiperSlide>
+                        );
+                    })}
+                </Swiper>
+            </div>
         </CarouselContainer>
     );
 };
diff --git a/src/renderer/components/virtual-table/cells/combined-title-cell.tsx b/src/renderer/components/virtual-table/cells/combined-title-cell.tsx
index 1c118e29..bd7be633 100644
--- a/src/renderer/components/virtual-table/cells/combined-title-cell.tsx
+++ b/src/renderer/components/virtual-table/cells/combined-title-cell.tsx
@@ -10,7 +10,7 @@ import styled from 'styled-components';
 import type { AlbumArtist, Artist } from '/@/renderer/api/types';
 import { Text } from '/@/renderer/components/text';
 import { AppRoute } from '/@/renderer/router/routes';
-import { ServerType } from '/@/renderer/types';
+import { ServerType } from '/@/renderer/api/types';
 import { Skeleton } from '/@/renderer/components/skeleton';
 
 const CellContainer = styled(motion.div)<{ height: number }>`
diff --git a/src/renderer/components/virtual-table/hooks/use-rating.ts b/src/renderer/components/virtual-table/hooks/use-rating.ts
index 6cc1a35d..8a2508a7 100644
--- a/src/renderer/components/virtual-table/hooks/use-rating.ts
+++ b/src/renderer/components/virtual-table/hooks/use-rating.ts
@@ -11,9 +11,9 @@ import {
     LibraryItem,
     AnyLibraryItems,
     RatingResponse,
+    ServerType,
 } from '/@/renderer/api/types';
 import { useSetAlbumListItemDataById, useSetQueueRating, getServerById } from '/@/renderer/store';
-import { ServerType } from '/@/renderer/types';
 
 export const useUpdateRating = () => {
     const queryClient = useQueryClient();
diff --git a/src/renderer/components/virtual-table/hooks/use-virtual-table.ts b/src/renderer/components/virtual-table/hooks/use-virtual-table.ts
index 1e7221cd..deac44e4 100644
--- a/src/renderer/components/virtual-table/hooks/use-virtual-table.ts
+++ b/src/renderer/components/virtual-table/hooks/use-virtual-table.ts
@@ -16,12 +16,12 @@ import orderBy from 'lodash/orderBy';
 import { generatePath, useNavigate } from 'react-router';
 import { api } from '/@/renderer/api';
 import { QueryPagination, queryKeys } from '/@/renderer/api/query-keys';
-import { BasePaginatedResponse, LibraryItem } from '/@/renderer/api/types';
+import { BasePaginatedResponse, LibraryItem, ServerListItem } from '/@/renderer/api/types';
 import { getColumnDefs, VirtualTableProps } from '/@/renderer/components/virtual-table';
 import { SetContextMenuItems, useHandleTableContextMenu } from '/@/renderer/features/context-menu';
 import { AppRoute } from '/@/renderer/router/routes';
 import { useListStoreActions } from '/@/renderer/store';
-import { ListDisplayType, ServerListItem, TablePagination } from '/@/renderer/types';
+import { ListDisplayType, TablePagination } from '/@/renderer/types';
 import { useSearchParams } from 'react-router-dom';
 import { ListKey, useListStoreByKey } from '../../../store/list.store';
 
diff --git a/src/renderer/components/virtual-table/index.tsx b/src/renderer/components/virtual-table/index.tsx
index 1f1039b6..42dc722a 100644
--- a/src/renderer/components/virtual-table/index.tsx
+++ b/src/renderer/components/virtual-table/index.tsx
@@ -158,6 +158,14 @@ const tableColumns: { [key: string]: ColDef } = {
             params.data ? params.data.channels : undefined,
         width: 100,
     },
+    codec: {
+        cellRenderer: (params: ICellRendererParams) => GenericCell(params, { position: 'center' }),
+        colId: TableColumn.CODEC,
+        headerName: i18n.t('table.column.codec'),
+        valueGetter: (params: ValueGetterParams) =>
+            params.data ? params.data.container : undefined,
+        width: 60,
+    },
     comment: {
         cellRenderer: NoteCell,
         colId: TableColumn.COMMENT,
diff --git a/src/renderer/components/virtual-table/table-config-dropdown.tsx b/src/renderer/components/virtual-table/table-config-dropdown.tsx
index 199534a5..6f09ff13 100644
--- a/src/renderer/components/virtual-table/table-config-dropdown.tsx
+++ b/src/renderer/components/virtual-table/table-config-dropdown.tsx
@@ -60,6 +60,10 @@ export const SONG_TABLE_COLUMNS = [
         label: i18n.t('table.config.label.bitrate', { postProcess: 'titleCase' }),
         value: TableColumn.BIT_RATE,
     },
+    {
+        label: i18n.t('table.config.label.codec', { postProcess: 'titleCase' }),
+        value: TableColumn.CODEC,
+    },
     {
         label: i18n.t('table.config.label.lastPlayed', { postProcess: 'titleCase' }),
         value: TableColumn.LAST_PLAYED,
diff --git a/src/renderer/features/albums/components/album-list-header-filters.tsx b/src/renderer/features/albums/components/album-list-header-filters.tsx
index c1710f65..0657a544 100644
--- a/src/renderer/features/albums/components/album-list-header-filters.tsx
+++ b/src/renderer/features/albums/components/album-list-header-filters.tsx
@@ -15,7 +15,7 @@ import {
     RiSettings3Fill,
 } from 'react-icons/ri';
 import { queryKeys } from '/@/renderer/api/query-keys';
-import { AlbumListSort, LibraryItem, SortOrder } from '/@/renderer/api/types';
+import { AlbumListSort, LibraryItem, ServerType, SortOrder } from '/@/renderer/api/types';
 import { Button, DropdownMenu, MultiSelect, Slider, Switch, Text } from '/@/renderer/components';
 import { VirtualInfiniteGridRef } from '/@/renderer/components/virtual-grid';
 import { ALBUM_TABLE_COLUMNS } from '/@/renderer/components/virtual-table';
@@ -31,7 +31,7 @@ import {
     useListStoreActions,
     useListStoreByKey,
 } from '/@/renderer/store';
-import { ListDisplayType, Play, ServerType, TableColumn } from '/@/renderer/types';
+import { ListDisplayType, Play, TableColumn } from '/@/renderer/types';
 import i18n from '/@/i18n/i18n';
 
 const FILTERS = {
diff --git a/src/renderer/features/artists/components/album-artist-list-header-filters.tsx b/src/renderer/features/artists/components/album-artist-list-header-filters.tsx
index 9bac50bb..ea4e440c 100644
--- a/src/renderer/features/artists/components/album-artist-list-header-filters.tsx
+++ b/src/renderer/features/artists/components/album-artist-list-header-filters.tsx
@@ -9,7 +9,7 @@ import { RiFolder2Line, RiMoreFill, RiRefreshLine, RiSettings3Fill } from 'react
 import { useListContext } from '../../../context/list-context';
 import { api } from '/@/renderer/api';
 import { queryKeys } from '/@/renderer/api/query-keys';
-import { AlbumArtistListSort, LibraryItem, SortOrder } from '/@/renderer/api/types';
+import { AlbumArtistListSort, LibraryItem, ServerType, SortOrder } from '/@/renderer/api/types';
 import { Button, DropdownMenu, MultiSelect, Slider, Switch, Text } from '/@/renderer/components';
 import { VirtualInfiniteGridRef } from '/@/renderer/components/virtual-grid';
 import { ALBUMARTIST_TABLE_COLUMNS } from '/@/renderer/components/virtual-table';
@@ -21,7 +21,7 @@ import {
     useListStoreActions,
     useListStoreByKey,
 } from '/@/renderer/store';
-import { ListDisplayType, ServerType, TableColumn } from '/@/renderer/types';
+import { ListDisplayType, TableColumn } from '/@/renderer/types';
 import i18n from '/@/i18n/i18n';
 
 const FILTERS = {
diff --git a/src/renderer/features/context-menu/context-menu-provider.tsx b/src/renderer/features/context-menu/context-menu-provider.tsx
index 83cce029..34ebc325 100644
--- a/src/renderer/features/context-menu/context-menu-provider.tsx
+++ b/src/renderer/features/context-menu/context-menu-provider.tsx
@@ -522,7 +522,7 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
 
     const handleUpdateRating = useCallback(
         (rating: number) => {
-            if (!ctx.dataNodes || !ctx.data) return;
+            if (!ctx.dataNodes && !ctx.data) return;
 
             let uniqueServerIds: string[] = [];
             let items: AnyLibraryItems = [];
diff --git a/src/renderer/features/discord-rpc/use-discord-rpc.ts b/src/renderer/features/discord-rpc/use-discord-rpc.ts
index 85aec1f5..7cffbb3d 100644
--- a/src/renderer/features/discord-rpc/use-discord-rpc.ts
+++ b/src/renderer/features/discord-rpc/use-discord-rpc.ts
@@ -8,7 +8,8 @@ import {
     usePlayerStore,
 } from '/@/renderer/store';
 import { SetActivity } from '@xhayper/discord-rpc';
-import { PlayerStatus, ServerType } from '/@/renderer/types';
+import { PlayerStatus } from '/@/renderer/types';
+import { ServerType } from '/@/renderer/api/types';
 
 const discordRpc = isElectron() ? window.electron.discordRpc : null;
 
@@ -40,7 +41,7 @@ export const useDiscordRpc = () => {
             largeImageText: currentSong?.album || 'Unknown album',
             smallImageKey: undefined,
             smallImageText: currentStatus,
-            state: artists && `By ${artists}` || "Unknown artist",
+            state: (artists && `By ${artists}`) || 'Unknown artist',
         };
 
         if (currentStatus === PlayerStatus.PLAYING) {
diff --git a/src/renderer/features/genres/components/genre-list-header-filters.tsx b/src/renderer/features/genres/components/genre-list-header-filters.tsx
index 1bf92863..5c53bb73 100644
--- a/src/renderer/features/genres/components/genre-list-header-filters.tsx
+++ b/src/renderer/features/genres/components/genre-list-header-filters.tsx
@@ -5,7 +5,7 @@ import { useQueryClient } from '@tanstack/react-query';
 import { useTranslation } from 'react-i18next';
 import { RiFolder2Fill, RiMoreFill, RiRefreshLine, RiSettings3Fill } from 'react-icons/ri';
 import { queryKeys } from '/@/renderer/api/query-keys';
-import { GenreListSort, LibraryItem, SortOrder } from '/@/renderer/api/types';
+import { GenreListSort, LibraryItem, ServerType, SortOrder } from '/@/renderer/api/types';
 import { Button, DropdownMenu, MultiSelect, Slider, Switch, Text } from '/@/renderer/components';
 import { VirtualInfiniteGridRef } from '/@/renderer/components/virtual-grid';
 import { GENRE_TABLE_COLUMNS } from '/@/renderer/components/virtual-table';
@@ -19,7 +19,7 @@ import {
     useListStoreActions,
     useListStoreByKey,
 } from '/@/renderer/store';
-import { ListDisplayType, ServerType, TableColumn } from '/@/renderer/types';
+import { ListDisplayType, TableColumn } from '/@/renderer/types';
 import i18n from '/@/i18n/i18n';
 
 const FILTERS = {
diff --git a/src/renderer/features/lyrics/queries/lyric-query.ts b/src/renderer/features/lyrics/queries/lyric-query.ts
index a02da327..6a862e07 100644
--- a/src/renderer/features/lyrics/queries/lyric-query.ts
+++ b/src/renderer/features/lyrics/queries/lyric-query.ts
@@ -6,15 +6,16 @@ import {
     InternetProviderLyricResponse,
     FullLyricsMetadata,
     LyricGetQuery,
-    SubsonicExtensions,
     StructuredLyric,
+    ServerType,
 } from '/@/renderer/api/types';
 import { QueryHookArgs } from '/@/renderer/lib/react-query';
 import { getServerById, useLyricsSettings } from '/@/renderer/store';
 import { queryKeys } from '/@/renderer/api/query-keys';
-import { ServerType } from '/@/renderer/types';
 import { api } from '/@/renderer/api';
 import isElectron from 'is-electron';
+import { hasFeature } from '/@/renderer/api/utils';
+import { ServerFeature } from '/@/renderer/api/features.types';
 
 const lyricsIpc = isElectron() ? window.electron.lyrics : null;
 
@@ -112,7 +113,7 @@ export const useSongLyricsBySong = (
                         source: server?.name ?? 'music server',
                     };
                 }
-            } else if (server.features && SubsonicExtensions.SONG_LYRICS in server.features) {
+            } else if (hasFeature(server, ServerFeature.SONG_LYRICS)) {
                 const subsonicLyrics = await api.controller
                     .getStructuredLyrics({
                         apiClientProps: { server, signal },
diff --git a/src/renderer/features/player/components/full-screen-player-image.tsx b/src/renderer/features/player/components/full-screen-player-image.tsx
index d3053a90..d3c51564 100644
--- a/src/renderer/features/player/components/full-screen-player-image.tsx
+++ b/src/renderer/features/player/components/full-screen-player-image.tsx
@@ -134,7 +134,7 @@ export const FullScreenPlayerImage = () => {
     const albumArtRes = useSettingsStore((store) => store.general.albumArtRes);
 
     const { queue } = usePlayerData();
-    const { opacity, useImageAspectRatio } = useFullScreenPlayerStore();
+    const { useImageAspectRatio } = useFullScreenPlayerStore();
     const currentSong = queue.current;
     const { color: background } = useFastAverageColor({
         algorithm: 'dominant',
@@ -250,7 +250,6 @@ export const FullScreenPlayerImage = () => {
             <MetadataContainer
                 className="full-screen-player-image-metadata"
                 maw="100%"
-                opacity={opacity}
                 spacing="xs"
             >
                 <TextTitle
@@ -278,7 +277,6 @@ export const FullScreenPlayerImage = () => {
                     to={generatePath(AppRoute.LIBRARY_ALBUMS_DETAIL, {
                         albumId: currentSong?.albumId || '',
                     })}
-                    transform="uppercase"
                     w="100%"
                     weight={600}
                 >
@@ -292,7 +290,6 @@ export const FullScreenPlayerImage = () => {
                         style={{
                             textShadow: 'var(--fullscreen-player-text-shadow)',
                         }}
-                        transform="uppercase"
                     >
                         {index > 0 && (
                             <Text
@@ -313,7 +310,6 @@ export const FullScreenPlayerImage = () => {
                             to={generatePath(AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, {
                                 albumArtistId: artist.id,
                             })}
-                            transform="uppercase"
                             weight={600}
                         >
                             {artist.name}
diff --git a/src/renderer/features/player/components/full-screen-player-queue.tsx b/src/renderer/features/player/components/full-screen-player-queue.tsx
index 0c0347f0..927773cd 100644
--- a/src/renderer/features/player/components/full-screen-player-queue.tsx
+++ b/src/renderer/features/player/components/full-screen-player-queue.tsx
@@ -43,11 +43,11 @@ const HeaderItemWrapper = styled.div`
     z-index: 2;
 `;
 
-interface TransparendGridContainerProps {
+interface TransparentGridContainerProps {
     opacity: number;
 }
 
-const GridContainer = styled.div<TransparendGridContainerProps>`
+const GridContainer = styled.div<TransparentGridContainerProps>`
     display: grid;
     grid-template-rows: auto minmax(0, 1fr);
     grid-template-columns: 1fr;
diff --git a/src/renderer/features/player/components/full-screen-player.tsx b/src/renderer/features/player/components/full-screen-player.tsx
index 9cf06f1a..970f52e4 100644
--- a/src/renderer/features/player/components/full-screen-player.tsx
+++ b/src/renderer/features/player/components/full-screen-player.tsx
@@ -153,7 +153,7 @@ const Controls = () => {
                                     defaultValue={opacity}
                                     label={(e) => `${e} %`}
                                     max={100}
-                                    min={1}
+                                    min={0}
                                     w="100%"
                                     onChangeEnd={(e) => setStore({ opacity: Number(e) })}
                                 />
diff --git a/src/renderer/features/player/components/shuffle-all-modal.tsx b/src/renderer/features/player/components/shuffle-all-modal.tsx
index ce127c05..1c585b26 100644
--- a/src/renderer/features/player/components/shuffle-all-modal.tsx
+++ b/src/renderer/features/player/components/shuffle-all-modal.tsx
@@ -15,11 +15,12 @@ import {
     ServerType,
     GenreListSort,
     SortOrder,
+    ServerListItem,
 } from '/@/renderer/api/types';
 import { api } from '/@/renderer/api';
 import { useAuthStore } from '/@/renderer/store';
 import { queryKeys } from '/@/renderer/api/query-keys';
-import { Play, PlayQueueAddOptions, ServerListItem } from '/@/renderer/types';
+import { Play, PlayQueueAddOptions } from '/@/renderer/types';
 import i18n from '/@/i18n/i18n';
 
 interface ShuffleAllSlice extends RandomSongListQuery {
diff --git a/src/renderer/features/player/utils.ts b/src/renderer/features/player/utils.ts
index 0b16f2aa..0b1a65fc 100644
--- a/src/renderer/features/player/utils.ts
+++ b/src/renderer/features/player/utils.ts
@@ -8,8 +8,9 @@ import {
     SongListResponse,
     SongListSort,
     SortOrder,
+    ServerListItem,
+    ServerType,
 } from '/@/renderer/api/types';
-import { ServerListItem, ServerType } from '/@/renderer/types';
 
 export const getPlaylistSongsById = async (args: {
     id: string;
diff --git a/src/renderer/features/playlists/components/create-playlist-form.tsx b/src/renderer/features/playlists/components/create-playlist-form.tsx
index 63c9fc47..6e720a6b 100644
--- a/src/renderer/features/playlists/components/create-playlist-form.tsx
+++ b/src/renderer/features/playlists/components/create-playlist-form.tsx
@@ -11,6 +11,8 @@ import { useCreatePlaylist } from '/@/renderer/features/playlists/mutations/crea
 import { convertQueryGroupToNDQuery } from '/@/renderer/features/playlists/utils';
 import { useCurrentServer } from '/@/renderer/store';
 import { useTranslation } from 'react-i18next';
+import { hasFeature } from '/@/renderer/api/utils';
+import { ServerFeature } from '/@/renderer/api/features.types';
 
 interface CreatePlaylistFormProps {
     onCancel: () => void;
@@ -120,12 +122,13 @@ export const CreatePlaylistForm = ({ onCancel }: CreatePlaylistFormProps) => {
                             })}
                         />
                     )}
-                    {server?.type === ServerType.NAVIDROME && (
-                        <Switch
-                            label="Is smart playlist?"
-                            onChange={(e) => setIsSmartPlaylist(e.currentTarget.checked)}
-                        />
-                    )}
+                    {server?.type === ServerType.NAVIDROME &&
+                        hasFeature(server, ServerFeature.SMART_PLAYLISTS) && (
+                            <Switch
+                                label="Is smart playlist?"
+                                onChange={(e) => setIsSmartPlaylist(e.currentTarget.checked)}
+                            />
+                        )}
                 </Group>
                 {server?.type === ServerType.NAVIDROME && isSmartPlaylist && (
                     <Stack pt="1rem">
diff --git a/src/renderer/features/playlists/components/playlist-detail-song-list-header-filters.tsx b/src/renderer/features/playlists/components/playlist-detail-song-list-header-filters.tsx
index 5da52b78..6cb06f59 100644
--- a/src/renderer/features/playlists/components/playlist-detail-song-list-header-filters.tsx
+++ b/src/renderer/features/playlists/components/playlist-detail-song-list-header-filters.tsx
@@ -17,7 +17,13 @@ import {
 } from 'react-icons/ri';
 import { api } from '/@/renderer/api';
 import { queryKeys } from '/@/renderer/api/query-keys';
-import { LibraryItem, PlaylistSongListQuery, SongListSort, SortOrder } from '/@/renderer/api/types';
+import {
+    LibraryItem,
+    PlaylistSongListQuery,
+    ServerType,
+    SongListSort,
+    SortOrder,
+} from '/@/renderer/api/types';
 import {
     DropdownMenu,
     Button,
@@ -39,7 +45,7 @@ import {
     useSetPlaylistStore,
     useSetPlaylistTablePagination,
 } from '/@/renderer/store';
-import { ListDisplayType, ServerType, Play, TableColumn } from '/@/renderer/types';
+import { ListDisplayType, Play, TableColumn } from '/@/renderer/types';
 import { usePlaylistDetail } from '/@/renderer/features/playlists/queries/playlist-detail-query';
 import { useParams, useNavigate } from 'react-router';
 import { SONG_TABLE_COLUMNS } from '/@/renderer/components/virtual-table';
diff --git a/src/renderer/features/playlists/components/playlist-list-header.tsx b/src/renderer/features/playlists/components/playlist-list-header.tsx
index 15fc3a3d..ec4f0138 100644
--- a/src/renderer/features/playlists/components/playlist-list-header.tsx
+++ b/src/renderer/features/playlists/components/playlist-list-header.tsx
@@ -9,11 +9,11 @@ import { PlaylistListHeaderFilters } from '/@/renderer/features/playlists/compon
 import { LibraryHeaderBar } from '/@/renderer/features/shared';
 import { useContainerQuery } from '/@/renderer/hooks';
 import { PlaylistListFilter, useCurrentServer, useListStoreActions } from '/@/renderer/store';
-import { ListDisplayType, ServerType } from '/@/renderer/types';
+import { ListDisplayType } from '/@/renderer/types';
 import debounce from 'lodash/debounce';
 import { useTranslation } from 'react-i18next';
 import { RiFileAddFill } from 'react-icons/ri';
-import { LibraryItem } from '/@/renderer/api/types';
+import { LibraryItem, ServerType } from '/@/renderer/api/types';
 import { useListFilterRefresh } from '../../../hooks/use-list-filter-refresh';
 import { useListContext } from '/@/renderer/context/list-context';
 import { useListStoreByKey } from '../../../store/list.store';
diff --git a/src/renderer/features/search/components/home-commands.tsx b/src/renderer/features/search/components/home-commands.tsx
index 914772d4..e32595cd 100644
--- a/src/renderer/features/search/components/home-commands.tsx
+++ b/src/renderer/features/search/components/home-commands.tsx
@@ -4,12 +4,11 @@ import { nanoid } from 'nanoid/non-secure';
 import { useTranslation } from 'react-i18next';
 import { generatePath, useNavigate } from 'react-router';
 import { createSearchParams } from 'react-router-dom';
-import { LibraryItem } from '/@/renderer/api/types';
+import { LibraryItem, ServerType } from '/@/renderer/api/types';
 import { CreatePlaylistForm } from '/@/renderer/features/playlists';
 import { Command, CommandPalettePages } from '/@/renderer/features/search/components/command';
 import { AppRoute } from '/@/renderer/router/routes';
 import { useCurrentServer } from '/@/renderer/store';
-import { ServerType } from '/@/renderer/types';
 
 interface HomeCommandsProps {
     handleClose: () => void;
diff --git a/src/renderer/features/search/components/server-commands.tsx b/src/renderer/features/search/components/server-commands.tsx
index c5425efb..e7c265c7 100644
--- a/src/renderer/features/search/components/server-commands.tsx
+++ b/src/renderer/features/search/components/server-commands.tsx
@@ -3,7 +3,7 @@ import { openModal } from '@mantine/modals';
 import { Command, CommandPalettePages } from '/@/renderer/features/search/components/command';
 import { ServerList } from '/@/renderer/features/servers';
 import { useAuthStoreActions, useServerList } from '/@/renderer/store';
-import { ServerListItem } from '/@/renderer/types';
+import { ServerListItem } from '/@/renderer/api/types';
 import { useTranslation } from 'react-i18next';
 import { useNavigate } from 'react-router';
 import { AppRoute } from '/@/renderer/router/routes';
diff --git a/src/renderer/features/servers/components/add-server-form.tsx b/src/renderer/features/servers/components/add-server-form.tsx
index 16fd21b8..3f1e7ca7 100644
--- a/src/renderer/features/servers/components/add-server-form.tsx
+++ b/src/renderer/features/servers/components/add-server-form.tsx
@@ -6,9 +6,9 @@ import { useFocusTrap } from '@mantine/hooks';
 import { closeAllModals } from '@mantine/modals';
 import isElectron from 'is-electron';
 import { nanoid } from 'nanoid/non-secure';
-import { AuthenticationResponse } from '/@/renderer/api/types';
+import { AuthenticationResponse, ServerType } from '/@/renderer/api/types';
 import { useAuthStoreActions } from '/@/renderer/store';
-import { ServerType } from '/@/renderer/types';
+import { ServerType, toServerType } from '/@/renderer/types';
 import { api } from '/@/renderer/api';
 import { useTranslation } from 'react-i18next';
 
@@ -33,15 +33,27 @@ export const AddServerForm = ({ onCancel }: AddServerFormProps) => {
     const form = useForm({
         initialValues: {
             legacyAuth: false,
-            name: '',
+            name: (localSettings ? localSettings.env.SERVER_NAME : window.SERVER_NAME) ?? '',
             password: '',
             savePassword: false,
-            type: ServerType.JELLYFIN,
-            url: 'http://',
+            type:
+                (localSettings
+                    ? localSettings.env.SERVER_TYPE
+                    : toServerType(window.SERVER_TYPE)) ?? ServerType.JELLYFIN,
+            url: (localSettings ? localSettings.env.SERVER_URL : window.SERVER_URL) ?? 'https://',
             username: '',
         },
     });
 
+    // server lock for web is only true if lock is true *and* all other properties are set
+    const serverLock =
+        (localSettings
+            ? !!localSettings.env.SERVER_LOCK
+            : !!window.SERVER_LOCK &&
+              window.SERVER_TYPE &&
+              window.SERVER_NAME &&
+              window.SERVER_URL) || false;
+
     const isSubmitDisabled = !form.values.name || !form.values.url || !form.values.username;
 
     const handleSubmit = form.onSubmit(async (values) => {
@@ -62,7 +74,7 @@ export const AddServerForm = ({ onCancel }: AddServerFormProps) => {
                     password: values.password,
                     username: values.username,
                 },
-                values.type,
+                values.type as ServerType,
             );
 
             if (!data) {
@@ -76,7 +88,7 @@ export const AddServerForm = ({ onCancel }: AddServerFormProps) => {
                 id: nanoid(),
                 name: values.name,
                 ndCredential: data.ndCredential,
-                type: values.type,
+                type: values.type as ServerType,
                 url: values.url.replace(/\/$/, ''),
                 userId: data.userId,
                 username: data.username,
@@ -117,11 +129,13 @@ export const AddServerForm = ({ onCancel }: AddServerFormProps) => {
             >
                 <SegmentedControl
                     data={SERVER_TYPES}
+                    disabled={serverLock}
                     {...form.getInputProps('type')}
                 />
                 <Group grow>
                     <TextInput
                         data-autofocus
+                        disabled={serverLock}
                         label={t('form.addServer.input', {
                             context: 'name',
                             postProcess: 'titleCase',
@@ -129,6 +143,7 @@ export const AddServerForm = ({ onCancel }: AddServerFormProps) => {
                         {...form.getInputProps('name')}
                     />
                     <TextInput
+                        disabled={serverLock}
                         label={t('form.addServer.input', {
                             context: 'url',
                             postProcess: 'titleCase',
diff --git a/src/renderer/features/servers/components/edit-server-form.tsx b/src/renderer/features/servers/components/edit-server-form.tsx
index 47fb110c..1735248e 100644
--- a/src/renderer/features/servers/components/edit-server-form.tsx
+++ b/src/renderer/features/servers/components/edit-server-form.tsx
@@ -7,9 +7,8 @@ import { closeAllModals } from '@mantine/modals';
 import isElectron from 'is-electron';
 import { useTranslation } from 'react-i18next';
 import { RiInformationLine } from 'react-icons/ri';
-import { AuthenticationResponse } from '/@/renderer/api/types';
+import { AuthenticationResponse, ServerListItem, ServerType } from '/@/renderer/api/types';
 import { useAuthStoreActions } from '/@/renderer/store';
-import { ServerListItem, ServerType } from '/@/renderer/types';
 import { api } from '/@/renderer/api';
 import i18n from '/@/i18n/i18n';
 import { queryClient } from '/@/renderer/lib/react-query';
diff --git a/src/renderer/features/servers/components/server-list-item.tsx b/src/renderer/features/servers/components/server-list-item.tsx
index bfc8ca01..4f872df1 100644
--- a/src/renderer/features/servers/components/server-list-item.tsx
+++ b/src/renderer/features/servers/components/server-list-item.tsx
@@ -7,7 +7,7 @@ import { RiDeleteBin2Line, RiEdit2Fill } from 'react-icons/ri';
 import { EditServerForm } from '/@/renderer/features/servers/components/edit-server-form';
 import { ServerSection } from '/@/renderer/features/servers/components/server-section';
 import { useAuthStoreActions } from '/@/renderer/store';
-import { ServerListItem as ServerItem } from '/@/renderer/types';
+import { ServerListItem as ServerItem } from '/@/renderer/api/types';
 
 const localSettings = isElectron() ? window.electron.localSettings : null;
 
diff --git a/src/renderer/features/settings/components/window/window-settings.tsx b/src/renderer/features/settings/components/window/window-settings.tsx
index 899b328b..2b60be69 100644
--- a/src/renderer/features/settings/components/window/window-settings.tsx
+++ b/src/renderer/features/settings/components/window/window-settings.tsx
@@ -131,6 +131,31 @@ export const WindowSettings = () => {
             isHidden: !isElectron(),
             title: t('setting.exitToTray', { postProcess: 'sentenceCase' }),
         },
+        {
+            control: (
+                <Switch
+                    aria-label="Toggle start in tray"
+                    defaultChecked={settings.startMinimized}
+                    disabled={!isElectron()}
+                    onChange={(e) => {
+                        if (!e) return;
+                        localSettings?.set('window_start_minimized', e.currentTarget.checked);
+                        setSettings({
+                            window: {
+                                ...settings,
+                                startMinimized: e.currentTarget.checked,
+                            },
+                        });
+                    }}
+                />
+            ),
+            description: t('setting.startMinimized', {
+                context: 'description',
+                postProcess: 'sentenceCase',
+            }),
+            isHidden: !isElectron(),
+            title: t('setting.startMinimized', { postProcess: 'sentenceCase' }),
+        },
     ];
 
     return <SettingsSection options={windowOptions} />;
diff --git a/src/renderer/features/sidebar/components/sidebar-icon.tsx b/src/renderer/features/sidebar/components/sidebar-icon.tsx
index 7d48e723..ef87e702 100644
--- a/src/renderer/features/sidebar/components/sidebar-icon.tsx
+++ b/src/renderer/features/sidebar/components/sidebar-icon.tsx
@@ -38,6 +38,9 @@ export const SidebarIcon = ({ active, route, size }: SidebarIconProps) => {
         case AppRoute.LIBRARY_ALBUMS:
             if (active) return <RiAlbumFill size={size} />;
             return <RiAlbumLine size={size} />;
+        case AppRoute.LIBRARY_ALBUM_ARTISTS:
+            if (active) return <RiUserVoiceFill size={size} />;
+            return <RiUserVoiceLine size={size} />;
         case AppRoute.LIBRARY_ARTISTS:
             if (active) return <RiUserVoiceFill size={size} />;
             return <RiUserVoiceLine size={size} />;
diff --git a/src/renderer/features/sidebar/components/sidebar-playlist-list.tsx b/src/renderer/features/sidebar/components/sidebar-playlist-list.tsx
index 8078043c..2592e191 100644
--- a/src/renderer/features/sidebar/components/sidebar-playlist-list.tsx
+++ b/src/renderer/features/sidebar/components/sidebar-playlist-list.tsx
@@ -1,11 +1,11 @@
 import { useCallback, useMemo, useState } from 'react';
-import { Flex, Group } from '@mantine/core';
+import { Box, Flex, Group } from '@mantine/core';
 import { useDebouncedValue } from '@mantine/hooks';
 import { useTranslation } from 'react-i18next';
 import { RiAddBoxFill, RiAddCircleFill, RiPlayFill } from 'react-icons/ri';
 import { generatePath } from 'react-router';
 import { Link } from 'react-router-dom';
-import { LibraryItem } from '/@/renderer/api/types';
+import { LibraryItem, Playlist } from '/@/renderer/api/types';
 import { Button, Text } from '/@/renderer/components';
 import { usePlayQueueAdd } from '/@/renderer/features/player';
 import { usePlaylistList } from '/@/renderer/features/playlists';
@@ -14,7 +14,7 @@ import { Play } from '/@/renderer/types';
 import AutoSizer from 'react-virtualized-auto-sizer';
 import { FixedSizeList, ListChildComponentProps } from 'react-window';
 import { useHideScrollbar } from '/@/renderer/hooks';
-import { useGeneralSettings } from '/@/renderer/store';
+import { useCurrentServer, useGeneralSettings } from '/@/renderer/store';
 
 interface SidebarPlaylistListProps {
     data: ReturnType<typeof usePlaylistList>['data'];
@@ -22,6 +22,20 @@ interface SidebarPlaylistListProps {
 
 const PlaylistRow = ({ index, data, style }: ListChildComponentProps) => {
     const { t } = useTranslation();
+
+    if (data?.items[index] === null) {
+        return (
+            <div style={{ margin: '0.5rem 0', padding: '0 1.5rem', ...style }}>
+                <Box
+                    fw="600"
+                    sx={{ fontSize: '1.2rem' }}
+                >
+                    {t('page.sidebar.shared', { postProcess: 'titleCase' })}
+                </Box>
+            </div>
+        );
+    }
+
     const path = data?.items[index].id
         ? data.defaultFullPlaylist
             ? generatePath(AppRoute.PLAYLISTS_DETAIL_SONGS, { playlistId: data.items[index].id })
@@ -125,6 +139,7 @@ export const SidebarPlaylistList = ({ data }: SidebarPlaylistListProps) => {
     const { isScrollbarHidden, hideScrollbarElementProps } = useHideScrollbar(0);
     const handlePlayQueueAdd = usePlayQueueAdd();
     const { defaultFullPlaylist } = useGeneralSettings();
+    const { type, username } = useCurrentServer() || {};
 
     const [rect, setRect] = useState({
         height: 0,
@@ -147,12 +162,30 @@ export const SidebarPlaylistList = ({ data }: SidebarPlaylistListProps) => {
     );
 
     const memoizedItemData = useMemo(() => {
-        return {
-            defaultFullPlaylist,
-            handlePlay: handlePlayPlaylist,
-            items: data?.items,
-        };
-    }, [data?.items, defaultFullPlaylist, handlePlayPlaylist]);
+        const base = { defaultFullPlaylist, handlePlay: handlePlayPlaylist };
+
+        if (!type || !username || !data?.items) {
+            return { ...base, items: data?.items };
+        }
+
+        const owned: Array<Playlist | null> = [];
+        const shared: Playlist[] = [];
+
+        for (const playlist of data.items) {
+            if (playlist.owner !== username) {
+                shared.push(playlist);
+            } else {
+                owned.push(playlist);
+            }
+        }
+
+        if (shared.length > 0) {
+            // Use `null` as a separator between owned and shared playlists
+            owned.push(null);
+        }
+
+        return { ...base, items: owned.concat(shared) };
+    }, [data?.items, defaultFullPlaylist, handlePlayPlaylist, type, username]);
 
     return (
         <Flex
@@ -168,7 +201,7 @@ export const SidebarPlaylistList = ({ data }: SidebarPlaylistListProps) => {
                                 : 'overlay-scrollbar'
                         }
                         height={debounced.height}
-                        itemCount={data?.items?.length || 0}
+                        itemCount={memoizedItemData?.items?.length || 0}
                         itemData={memoizedItemData}
                         itemSize={25}
                         overscanCount={20}
diff --git a/src/renderer/features/songs/components/song-list-header-filters.tsx b/src/renderer/features/songs/components/song-list-header-filters.tsx
index a1ee1f1c..df3e64e9 100644
--- a/src/renderer/features/songs/components/song-list-header-filters.tsx
+++ b/src/renderer/features/songs/components/song-list-header-filters.tsx
@@ -15,7 +15,7 @@ import {
 } from 'react-icons/ri';
 import { useListStoreByKey } from '../../../store/list.store';
 import { queryKeys } from '/@/renderer/api/query-keys';
-import { LibraryItem, SongListSort, SortOrder } from '/@/renderer/api/types';
+import { LibraryItem, ServerType, SongListSort, SortOrder } from '/@/renderer/api/types';
 import { Button, DropdownMenu, MultiSelect, Slider, Switch, Text } from '/@/renderer/components';
 import { VirtualInfiniteGridRef } from '/@/renderer/components/virtual-grid';
 import { SONG_TABLE_COLUMNS } from '/@/renderer/components/virtual-table';
@@ -27,7 +27,7 @@ import { useContainerQuery } from '/@/renderer/hooks';
 import { useListFilterRefresh } from '/@/renderer/hooks/use-list-filter-refresh';
 import { queryClient } from '/@/renderer/lib/react-query';
 import { SongListFilter, useCurrentServer, useListStoreActions } from '/@/renderer/store';
-import { ListDisplayType, Play, ServerType, TableColumn } from '/@/renderer/types';
+import { ListDisplayType, Play, TableColumn } from '/@/renderer/types';
 import i18n from '/@/i18n/i18n';
 
 const FILTERS = {
diff --git a/src/renderer/features/titlebar/components/app-menu.tsx b/src/renderer/features/titlebar/components/app-menu.tsx
index b5da6025..0eb15e13 100644
--- a/src/renderer/features/titlebar/components/app-menu.tsx
+++ b/src/renderer/features/titlebar/components/app-menu.tsx
@@ -29,7 +29,7 @@ import {
     useSidebarStore,
     useAppStoreActions,
 } from '/@/renderer/store';
-import { ServerListItem, ServerType } from '/@/renderer/types';
+import { ServerListItem, ServerType } from '/@/renderer/api/types';
 import packageJson from '../../../../../package.json';
 
 const browser = isElectron() ? window.electron.browser : null;
diff --git a/src/renderer/hooks/use-server-authenticated.ts b/src/renderer/hooks/use-server-authenticated.ts
new file mode 100644
index 00000000..3696595c
--- /dev/null
+++ b/src/renderer/hooks/use-server-authenticated.ts
@@ -0,0 +1,54 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { useCurrentServer } from '/@/renderer/store';
+import { AuthState, ServerListItem, ServerType } from '/@/renderer/types';
+import { api } from '/@/renderer/api';
+import { SongListSort, SortOrder } from '/@/renderer/api/types';
+import { debounce } from 'lodash';
+
+export const useServerAuthenticated = () => {
+    const priorServerId = useRef<string>();
+    const server = useCurrentServer();
+    const [ready, setReady] = useState(
+        server?.type === ServerType.NAVIDROME ? AuthState.LOADING : AuthState.VALID,
+    );
+
+    const authenticateNavidrome = useCallback(async (server: ServerListItem) => {
+        // This trick works because navidrome-api.ts will internally check for authentication
+        // failures and try to log in again (where available). So, all that's necessary is
+        // making one request first
+        try {
+            await api.controller.getSongList({
+                apiClientProps: { server },
+                query: {
+                    limit: 1,
+                    sortBy: SongListSort.NAME,
+                    sortOrder: SortOrder.ASC,
+                    startIndex: 0,
+                },
+            });
+
+            setReady(AuthState.VALID);
+        } catch (error) {
+            setReady(AuthState.INVALID);
+        }
+    }, []);
+
+    const debouncedAuth = debounce((server: ServerListItem) => {
+        authenticateNavidrome(server).catch(console.error);
+    }, 300);
+
+    useEffect(() => {
+        if (priorServerId.current !== server?.id) {
+            priorServerId.current = server?.id || '';
+
+            if (server?.type === ServerType.NAVIDROME) {
+                setReady(AuthState.LOADING);
+                debouncedAuth(server);
+            } else {
+                setReady(AuthState.VALID);
+            }
+        }
+    }, [debouncedAuth, server]);
+
+    return ready;
+};
diff --git a/src/renderer/hooks/use-server-version.ts b/src/renderer/hooks/use-server-version.ts
index 6ca1327d..96245e76 100644
--- a/src/renderer/hooks/use-server-version.ts
+++ b/src/renderer/hooks/use-server-version.ts
@@ -3,6 +3,7 @@ import { useAuthStoreActions, useCurrentServer } from '/@/renderer/store';
 import { useQuery } from '@tanstack/react-query';
 import { queryKeys } from '/@/renderer/api/query-keys';
 import { controller } from '/@/renderer/api/controller';
+import isEqual from 'lodash/isEqual';
 
 export const useServerVersion = () => {
     const { updateServer } = useAuthStoreActions();
@@ -22,14 +23,18 @@ export const useServerVersion = () => {
     });
 
     useEffect(() => {
-        if (server && server.id === serverInfo.data?.id) {
-            const { version, features } = serverInfo.data;
-            if (version !== server.version) {
+        if (!server?.id) {
+            return;
+        }
+
+        if (server?.id === serverInfo.data?.id) {
+            const { version, features } = serverInfo.data || {};
+            if (version !== server?.version || !isEqual(features, server?.features)) {
                 updateServer(server.id, {
                     features,
                     version,
                 });
             }
         }
-    }, [server, serverInfo.data, updateServer]);
+    }, [serverInfo?.data, server?.features, server?.id, server?.version, updateServer]);
 };
diff --git a/src/renderer/index.ejs b/src/renderer/index.ejs
index ca220526..4d5ecd15 100644
--- a/src/renderer/index.ejs
+++ b/src/renderer/index.ejs
@@ -6,6 +6,9 @@
   <meta http-equiv="Content-Security-Policy" />
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Feishin</title>
+  <% if (web) { %>
+  <script src="settings.js"></script>
+  <% } %>
 </head>
 
 <body>
diff --git a/src/renderer/preload.d.ts b/src/renderer/preload.d.ts
index db69c9ba..7d8c9258 100644
--- a/src/renderer/preload.d.ts
+++ b/src/renderer/preload.d.ts
@@ -13,6 +13,10 @@ import { Browser } from '/@/main/preload/browser';
 
 declare global {
     interface Window {
+        SERVER_LOCK?: boolean;
+        SERVER_NAME?: string;
+        SERVER_TYPE?: string;
+        SERVER_URL?: string;
         electron: {
             browser: Browser;
             discordRpc: DiscordRpc;
diff --git a/src/renderer/router/app-outlet.tsx b/src/renderer/router/app-outlet.tsx
index d77a8981..8e1c52a0 100644
--- a/src/renderer/router/app-outlet.tsx
+++ b/src/renderer/router/app-outlet.tsx
@@ -3,7 +3,9 @@ import isElectron from 'is-electron';
 import { Navigate, Outlet } from 'react-router-dom';
 import { AppRoute } from '/@/renderer/router/routes';
 import { useCurrentServer, useSetPlayerFallback } from '/@/renderer/store';
-import { toast } from '/@/renderer/components';
+import { Spinner, toast } from '/@/renderer/components';
+import { useServerAuthenticated } from '/@/renderer/hooks/use-server-authenticated';
+import { AuthState } from '/@/renderer/types';
 
 const ipc = isElectron() ? window.electron.ipc : null;
 const utils = isElectron() ? window.electron.utils : null;
@@ -12,6 +14,7 @@ const mpvPlayerListener = isElectron() ? window.electron.mpvPlayerListener : nul
 export const AppOutlet = () => {
     const currentServer = useCurrentServer();
     const setFallback = useSetPlayerFallback();
+    const authState = useServerAuthenticated();
 
     const isActionsRequired = useMemo(() => {
         const isServerRequired = !currentServer;
@@ -37,7 +40,11 @@ export const AppOutlet = () => {
         };
     }, [setFallback]);
 
-    if (isActionsRequired) {
+    if (authState === AuthState.LOADING) {
+        return <Spinner container />;
+    }
+
+    if (isActionsRequired || authState === AuthState.INVALID) {
         return (
             <Navigate
                 replace
diff --git a/src/renderer/store/auth.store.ts b/src/renderer/store/auth.store.ts
index 7fa958cd..8711a59e 100644
--- a/src/renderer/store/auth.store.ts
+++ b/src/renderer/store/auth.store.ts
@@ -6,7 +6,7 @@ import { immer } from 'zustand/middleware/immer';
 import { useAlbumArtistListDataStore } from '/@/renderer/store/album-artist-list-data.store';
 import { useAlbumListDataStore } from '/@/renderer/store/album-list-data.store';
 import { useListStore } from '/@/renderer/store/list.store';
-import { ServerListItem } from '/@/renderer/types';
+import { ServerListItem } from '/@/renderer/api/types';
 
 export interface AuthState {
     currentServer: ServerListItem | null;
diff --git a/src/renderer/store/settings.store.ts b/src/renderer/store/settings.store.ts
index bf475b19..1d5aed8c 100644
--- a/src/renderer/store/settings.store.ts
+++ b/src/renderer/store/settings.store.ts
@@ -267,6 +267,7 @@ export interface SettingsState {
         disableAutoUpdate: boolean;
         exitToTray: boolean;
         minimizeToTray: boolean;
+        startMinimized: boolean;
         windowBarStyle: Platform;
     };
 }
@@ -575,6 +576,7 @@ const initialState: SettingsState = {
         disableAutoUpdate: false,
         exitToTray: false,
         minimizeToTray: false,
+        startMinimized: false,
         windowBarStyle: platformDefaultWindowBarStyle,
     },
 };
diff --git a/src/renderer/types.ts b/src/renderer/types.ts
index 5df65673..bba64186 100644
--- a/src/renderer/types.ts
+++ b/src/renderer/types.ts
@@ -60,6 +60,17 @@ export enum ServerType {
     SUBSONIC = 'subsonic',
 }
 
+export const toServerType = (value?: string): ServerType | null => {
+    switch (value?.toLowerCase()) {
+        case ServerType.JELLYFIN:
+            return ServerType.JELLYFIN;
+        case ServerType.NAVIDROME:
+            return ServerType.NAVIDROME;
+        default:
+            return null;
+    }
+};
+
 export type ServerListItem = {
     credential: string;
     features?: Record<string, number[]>;
@@ -144,6 +155,7 @@ export enum TableColumn {
     BIT_RATE = 'bitRate',
     BPM = 'bpm',
     CHANNELS = 'channels',
+    CODEC = 'codec',
     COMMENT = 'comment',
     DATE_ADDED = 'dateAdded',
     DISC_NUMBER = 'discNumber',
@@ -213,3 +225,9 @@ export enum FontType {
 }
 
 export type TitleTheme = 'dark' | 'light' | 'system';
+
+export enum AuthState {
+    INVALID = 'invalid',
+    LOADING = 'loading',
+    VALID = 'valid',
+}