feat: add custom DNS servers

server/index.ts

@@ -84,6 +84,16 @@ app
     const settings = getSettings().load();
     restartFlag.initializeSettings(settings.main);
 
+    // Overwrite DNS servers
+    if (settings.main.overwriteDnsServers) {
+      cacheable.servers = settings.main.overwriteDnsServers
+        .split(',')
+        .map((server) => server.trim());
+      logger.info('Using custom DNS servers', {
+        label: 'Settings',
+      });
+    }
+
     // Migrate library types
     if (
       settings.plex.libraries.length > 1 &&

server/lib/settings/index.ts

@@ -118,6 +118,7 @@ export interface MainSettings {
   mediaServerType: number;
   partialRequestsEnabled: boolean;
   locale: string;
+  overwriteDnsServers?: string;
 }
 
 interface PublicSettings {

src/components/Settings/SettingsMain/index.tsx

@@ -55,6 +55,9 @@ const messages = defineMessages({
   validationApplicationUrlTrailingSlash: 'URL must not end in a trailing slash',
   partialRequestsEnabled: 'Allow Partial Series Requests',
   locale: 'Display Language',
+  overwriteDnsServers: 'Overwrite Default DNS Servers',
+  overwriteDnsServersTip:
+    'A comma-separated list of DNS server to use instead of the default ones',
 });
 
 const SettingsMain = () => {
@@ -134,6 +137,7 @@ const SettingsMain = () => {
             partialRequestsEnabled: data?.partialRequestsEnabled,
             trustProxy: data?.trustProxy,
             cacheImages: data?.cacheImages,
+            overwriteDnsServers: data?.overwriteDnsServers,
           }}
           enableReinitialize
           validationSchema={MainSettingsSchema}
@@ -150,6 +154,7 @@ const SettingsMain = () => {
                 partialRequestsEnabled: values.partialRequestsEnabled,
                 trustProxy: values.trustProxy,
                 cacheImages: values.cacheImages,
+                overwriteDnsServers: values.overwriteDnsServers,
               });
               mutate('/api/v1/settings/public');
               mutate('/api/v1/status');
@@ -427,6 +432,37 @@ const SettingsMain = () => {
                     />
                   </div>
                 </div>
+                <div className="form-row">
+                  <label
+                    htmlFor="overwriteDnsServers"
+                    className="checkbox-label"
+                  >
+                    <span className="mr-2">
+                      {intl.formatMessage(messages.overwriteDnsServers)}
+                    </span>
+                    <SettingsBadge badgeType="advanced" className="mr-2" />
+                    <SettingsBadge badgeType="restartRequired" />
+                    <span className="label-tip">
+                      {intl.formatMessage(messages.overwriteDnsServersTip)}
+                    </span>
+                  </label>
+                  <div className="form-input-area">
+                    <div className="form-input-field">
+                      <Field
+                        id="overwriteDnsServers"
+                        name="overwriteDnsServers"
+                        type="text"
+                      />
+                    </div>
+                    {errors.overwriteDnsServers &&
+                      touched.overwriteDnsServers &&
+                      typeof errors.overwriteDnsServers === 'string' && (
+                        <div className="error">
+                          {errors.overwriteDnsServers}
+                        </div>
+                      )}
+                  </div>
+                </div>
                 <div className="actions">
                   <div className="flex justify-end">
                     <span className="ml-3 inline-flex rounded-md shadow-sm">