From c91fe4f18900a7db25b2d0a8ab93a691848d0e55 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Gabriele=20Vigan=C3=B2?= <infogabrielevigano@gmail.com>
Date: Sat, 13 Dec 2025 15:49:13 +0100
Subject: [PATCH] fix: swap URL and Short Code inputs order (#10)

---
 src/components/create-url-dialog.tsx | 30 ++++++++++++++--------------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/components/create-url-dialog.tsx b/src/components/create-url-dialog.tsx
index f1e322e..7b0f621 100644
--- a/src/components/create-url-dialog.tsx
+++ b/src/components/create-url-dialog.tsx
@@ -71,20 +71,15 @@ export function CreateUrlDialog({
         <form {...getFormProps(form, {})} action={action}>
           <div>{form.errors}</div>
           <div className="grid grid-cols-4 gap-x-4 py-4">
-            <span
-              id={fields.url.errorId}
-              className="text-xs col-start-2 col-span-3 text-red-600 text-center"
-            >
-              {fields.url.errors}
-            </span>
             <div className="grid col-span-4 grid-cols-4 items-center gap-4 mb-4">
-              <Label htmlFor={fields.url.id} className="text-right">
-                URL
+              <Label htmlFor={fields.shortCode.id} className="text-right">
+                Short Code
               </Label>
               <Input
-                {...getInputProps(fields.url, { type: "url" })}
-                placeholder="https://example.polinetwork.org/path"
+                {...getInputProps(fields.shortCode, { type: "text" })}
+                placeholder="custom-code (optional)"
                 className="col-span-3"
+                title="Short code can only contain letters, numbers, hyphens and underscores (2-20 characters)"
               />
             </div>
             <span
@@ -94,16 +89,21 @@ export function CreateUrlDialog({
               {fields.shortCode.errors?.join(", ")}
             </span>
             <div className="grid col-span-4 grid-cols-4 items-center gap-4 mb-4">
-              <Label htmlFor={fields.shortCode.id} className="text-right">
-                Short Code
+              <Label htmlFor={fields.url.id} className="text-right">
+                URL
               </Label>
               <Input
-                {...getInputProps(fields.shortCode, { type: "text" })}
-                placeholder="custom-code (optional)"
+                {...getInputProps(fields.url, { type: "url" })}
+                placeholder="https://example.polinetwork.org/path"
                 className="col-span-3"
-                title="Short code can only contain letters, numbers, hyphens and underscores (2-20 characters)"
               />
             </div>
+            <span
+              id={fields.url.errorId}
+              className="text-xs col-start-2 col-span-3 text-red-600 text-center"
+            >
+              {fields.url.errors}
+            </span>
             <div className="col-span-4 text-sm text-muted-foreground">
               If you leave <i>Short Code</i> empty, a random one will be
               auto-generated upon submission.