From bf0709dcb2f35f6231f058dd9511214497551612 Mon Sep 17 00:00:00 2001
From: Isaac Roberts <119639439+madebyisaacr@users.noreply.github.com>
Date: Fri, 17 Apr 2026 02:01:29 -0400
Subject: [PATCH] Fix spinner alignment in Airtable

---
 plugins/airtable/package.json         | 1 +
 plugins/airtable/src/App.css          | 4 ++++
 plugins/airtable/src/FieldMapping.tsx | 3 ++-
 yarn.lock                             | 1 +
 4 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/plugins/airtable/package.json b/plugins/airtable/package.json
index 2ca0a3b8a..1101d8311 100644
--- a/plugins/airtable/package.json
+++ b/plugins/airtable/package.json
@@ -14,6 +14,7 @@
         "check-vitest": "vitest run"
     },
     "dependencies": {
+        "classnames": "^2.5.1",
         "framer-plugin": "^3.10.3",
         "marked": "^17.0.1",
         "react": "^18.3.1",
diff --git a/plugins/airtable/src/App.css b/plugins/airtable/src/App.css
index 9f79d7fff..0f2cb8bc5 100644
--- a/plugins/airtable/src/App.css
+++ b/plugins/airtable/src/App.css
@@ -193,6 +193,10 @@ select:not(:disabled) {
     display: inline-block;
 }
 
+.import-button.syncing {
+    display: flex;
+}
+
 /* Login */
 
 .login-steps {
diff --git a/plugins/airtable/src/FieldMapping.tsx b/plugins/airtable/src/FieldMapping.tsx
index 3da3e110f..35ec947b4 100644
--- a/plugins/airtable/src/FieldMapping.tsx
+++ b/plugins/airtable/src/FieldMapping.tsx
@@ -1,3 +1,4 @@
+import cx from "classnames"
 import type { ManagedCollection, ManagedCollectionField, ManagedCollectionFieldInput } from "framer-plugin"
 import { FramerPluginClosedError, framer, useIsAllowedTo } from "framer-plugin"
 import { memo, useEffect, useMemo, useState } from "react"
@@ -401,7 +402,7 @@ export function FieldMapping({ collection, dataSource, initialSlugFieldId }: Fie
             <footer>
                 <hr className="sticky-top" />
                 <button
-                    className="import-button"
+                    className={cx("import-button", isSyncing && "syncing")}
                     type="submit"
                     disabled={isSyncing || !isAllowedToManage}
                     tabIndex={0}
diff --git a/yarn.lock b/yarn.lock
index c328962c7..b3a05f93d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3834,6 +3834,7 @@ __metadata:
   dependencies:
     "@types/react": "npm:^18.3.24"
     "@types/react-dom": "npm:^18.3.7"
+    classnames: "npm:^2.5.1"
     framer-plugin: "npm:^3.10.3"
     happy-dom: "npm:^20.8.9"
     marked: "npm:^17.0.1"