Enhance DNS record management by adding support for optional DNS providers.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 9111ef36-26c8-4085-84ca-a35dc1fec1b5
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/7083d608-d6d3-4a6a-9a27-6286c5109627/996e6e00-8df0-4e11-8054-4bedce75e1d8.jpg

client/src/pages/dns-records.tsx

@@ -167,8 +167,12 @@ export default function DnsRecordsPage() {
     mutationFn: async (data: z.infer<typeof dnsRecordSchema>) => {
       if (!domainId) throw new Error("Domain ID is required");
       
+      // Convert empty providerId to null
+      const providerId = data.providerId === "" ? null : data.providerId;
+      
       const recordData: InsertDnsRecord = {
         ...data,
+        providerId,
         domainId,
       };
       
@@ -199,7 +203,15 @@ export default function DnsRecordsPage() {
   // Update DNS record mutation
   const updateRecordMutation = useMutation({
     mutationFn: async ({ id, data }: { id: string, data: z.infer<typeof dnsRecordSchema> }) => {
-      const res = await apiRequest("PUT", `/api/dns-records/${id}`, data);
+      // Convert empty providerId to null
+      const providerId = data.providerId === "" ? null : data.providerId;
+      
+      const updatedData = {
+        ...data,
+        providerId,
+      };
+      
+      const res = await apiRequest("PUT", `/api/dns-records/${id}`, updatedData);
       return await res.json();
     },
     onSuccess: () => {
@@ -730,6 +742,41 @@ export default function DnsRecordsPage() {
                 )}
               />
               
+              <FormField
+                control={form.control}
+                name="providerId"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>DNS Provider</FormLabel>
+                    <Select
+                      onValueChange={field.onChange}
+                      defaultValue={field.value}
+                    >
+                      <FormControl>
+                        <SelectTrigger>
+                          <SelectValue placeholder="Select a DNS provider" />
+                        </SelectTrigger>
+                      </FormControl>
+                      <SelectContent>
+                        <SelectItem value="">None</SelectItem>
+                        {providers.map((provider) => (
+                          <SelectItem 
+                            key={provider.id} 
+                            value={provider.id}
+                          >
+                            {provider.name}
+                          </SelectItem>
+                        ))}
+                      </SelectContent>
+                    </Select>
+                    <FormDescription>
+                      Select the DNS provider to use for this record
+                    </FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+              
               <FormField
                 control={form.control}
                 name="type"

shared/schema.ts

@@ -204,17 +204,23 @@ export const insertDomainSchema = createInsertSchema(domains)
     providerId: z.string().uuid().optional(),
   });
 
-export const insertDnsRecordSchema = createInsertSchema(dnsRecords).pick({
-  domainId: true,
-  name: true,
-  type: true,
-  content: true,
-  ttl: true,
-  proxied: true,
-  isActive: true,
-  isAutoIP: true,
-  notes: true,
-});
+export const insertDnsRecordSchema = createInsertSchema(dnsRecords)
+  .pick({
+    domainId: true,
+    name: true,
+    type: true,
+    content: true,
+    ttl: true,
+    proxied: true,
+    isActive: true,
+    isAutoIP: true,
+    notes: true,
+    providerId: true,
+  })
+  .extend({
+    // Override providerId to make it optional
+    providerId: z.string().uuid().nullable().optional(),
+  });
 
 export const insertProviderSchema = createInsertSchema(providers).pick({
   name: true,