ui: replace custom loading spinners with IconSpinner component across multiple files

apps/web/src/pages/segments/index.tsx

@@ -8,6 +8,7 @@ import {
   CardHeader,
   CardTitle,
   ConfirmDialog,
+  IconSpinner,
 } from '@plunk/ui';
 import type {Segment} from '@plunk/db';
 import type {FilterCondition} from '@plunk/types';
@@ -105,22 +106,7 @@ export default function SegmentsPage() {
           {/* Segments Grid */}
           {isLoading ? (
             <div className="flex items-center justify-center py-12">
-              <div className="text-center">
-                <svg
-                  className="h-8 w-8 animate-spin mx-auto text-neutral-900"
-                  xmlns="http://www.w3.org/2000/svg"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                >
-                  <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
-                  <path
-                    className="opacity-75"
-                    fill="currentColor"
-                    d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
-                  />
-                </svg>
-                <p className="mt-2 text-sm text-neutral-500">Loading segments...</p>
-              </div>
+              <IconSpinner />
             </div>
           ) : segments?.length === 0 ? (
             <Card>