diff --git a/.changeset/friendly-jokes-repair.md b/.changeset/friendly-jokes-repair.md
new file mode 100644
index 0000000000..6bbbe1c049
--- /dev/null
+++ b/.changeset/friendly-jokes-repair.md
@@ -0,0 +1,5 @@
+---
+'@nhost/dashboard': patch
+---
+
+chore(dashboard): tweaks and fixes to the service form and dialog
diff --git a/dashboard/src/components/ui/v2/icons/ArrowsClockwise/ArrowsClockwise.tsx b/dashboard/src/components/ui/v2/icons/ArrowsClockwise/ArrowsClockwise.tsx
new file mode 100644
index 0000000000..3fa2752476
--- /dev/null
+++ b/dashboard/src/components/ui/v2/icons/ArrowsClockwise/ArrowsClockwise.tsx
@@ -0,0 +1,44 @@
+import type { IconProps } from '@/components/ui/v2/icons';
+
+function ArrowsClockwise(props: IconProps) {
+  return (
+    <svg
+      width="16"
+      height="16"
+      viewBox="0 0 16 16"
+      fill="none"
+      aria-label="Update"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M11.0103 6.23227H14.0103V3.23227"
+        stroke="currentColor"
+        strokeWidth="1.5"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M4.11084 4.11091C4.62156 3.60019 5.22788 3.19506 5.89517 2.91866C6.56246 2.64226 7.27766 2.5 7.99993 2.5C8.7222 2.5 9.4374 2.64226 10.1047 2.91866C10.772 3.19506 11.3783 3.60019 11.889 4.11091L14.0103 6.23223"
+        stroke="currentColor"
+        strokeWidth="1.5"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M4.98975 9.76773H1.98975V12.7677"
+        stroke="currentColor"
+        strokeWidth="1.5"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M11.8892 11.8891C11.3785 12.3998 10.7722 12.8049 10.1049 13.0813C9.43762 13.3577 8.72242 13.5 8.00015 13.5C7.27788 13.5 6.56269 13.3577 5.89539 13.0813C5.2281 12.8049 4.62179 12.3998 4.11107 11.8891L1.98975 9.76776"
+        stroke="currentColor"
+        strokeWidth="1.5"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+
+ArrowsClockwise.displayName = 'NhostArrowsClockwise';
+
+export default ArrowsClockwise;
diff --git a/dashboard/src/components/ui/v2/icons/ArrowsClockwise/index.ts b/dashboard/src/components/ui/v2/icons/ArrowsClockwise/index.ts
new file mode 100644
index 0000000000..b333702d33
--- /dev/null
+++ b/dashboard/src/components/ui/v2/icons/ArrowsClockwise/index.ts
@@ -0,0 +1 @@
+export { default as ArrowsClockwise } from './ArrowsClockwise';
diff --git a/dashboard/src/features/services/components/ServiceForm/ServiceForm.tsx b/dashboard/src/features/services/components/ServiceForm/ServiceForm.tsx
index 54b75b6fdf..64fa6dc1b5 100644
--- a/dashboard/src/features/services/components/ServiceForm/ServiceForm.tsx
+++ b/dashboard/src/features/services/components/ServiceForm/ServiceForm.tsx
@@ -3,6 +3,7 @@ import { Form } from '@/components/form/Form';
 import { Alert } from '@/components/ui/v2/Alert';
 import { Box } from '@/components/ui/v2/Box';
 import { Button } from '@/components/ui/v2/Button';
+import { ArrowsClockwise } from '@/components/ui/v2/icons/ArrowsClockwise';
 import { CopyIcon } from '@/components/ui/v2/icons/CopyIcon';
 import { InfoIcon } from '@/components/ui/v2/icons/InfoIcon';
 import { PlusIcon } from '@/components/ui/v2/icons/PlusIcon';
@@ -344,7 +345,7 @@ export default function ServiceForm({
               <Tooltip title="Name of the service, must be unique per project.">
                 <InfoIcon
                   aria-label="Info"
-                  className="h-4 w-4"
+                  className="w-4 h-4"
                   color="primary"
                 />
               </Tooltip>
@@ -384,7 +385,7 @@ export default function ServiceForm({
               >
                 <InfoIcon
                   aria-label="Info"
-                  className="h-4 w-4"
+                  className="w-4 h-4"
                   color="primary"
                 />
               </Tooltip>
@@ -415,7 +416,7 @@ export default function ServiceForm({
               <Tooltip title="Command to run when to start the service. This is optional as the image may already have a baked-in command.">
                 <InfoIcon
                   aria-label="Info"
-                  className="h-4 w-4"
+                  className="w-4 h-4"
                   color="primary"
                 />
               </Tooltip>
@@ -459,7 +460,7 @@ export default function ServiceForm({
         {createServiceFormError && (
           <Alert
             severity="error"
-            className="grid grid-flow-col items-center justify-between px-4 py-3"
+            className="grid items-center justify-between grid-flow-col px-4 py-3"
           >
             <span className="text-left">
               <strong>Error:</strong> {createServiceFormError.message}
@@ -482,7 +483,7 @@ export default function ServiceForm({
             <Button
               type="submit"
               disabled={isSubmitting}
-              startIcon={<PlusIcon />}
+              startIcon={serviceID ? <ArrowsClockwise /> : <PlusIcon />}
             >
               {serviceID ? 'Update' : 'Create'}
             </Button>
diff --git a/dashboard/src/features/services/components/ServiceForm/components/ServiceDetailsDialog/ServiceDetailsDialog.tsx b/dashboard/src/features/services/components/ServiceForm/components/ServiceDetailsDialog/ServiceDetailsDialog.tsx
index 3e4e328a36..7f007d449c 100644
--- a/dashboard/src/features/services/components/ServiceForm/components/ServiceDetailsDialog/ServiceDetailsDialog.tsx
+++ b/dashboard/src/features/services/components/ServiceForm/components/ServiceDetailsDialog/ServiceDetailsDialog.tsx
@@ -55,7 +55,8 @@ export default function ServiceDetailsDialog({
             .filter((port) => port.publish)
             .map((port) => (
               <InfoCard
-                title={`${port.type}:${port.port}`}
+                key={String(port.port)}
+                title={`${port.type} <--> ${port.port}`}
                 value={getPortURL(port.port)}
               />
             ))}