Merge pull request #3700 from LiteFarmOrg/farm-addon-frontend-visual-…

…adjustments Farm Addon & Partner visual adjustments
LiteFarmOrg · Feb 28, 2025 · b6d269a · b6d269a
2 parents ff67148 + 0f2941d
commit b6d269a
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/packages/webapp/src/components/Form/Button/button.module.scss b/packages/webapp/src/components/Form/Button/button.module.scss
@@ -59,6 +59,7 @@
   --active-background: var(--Colors-Secondary-Secondary-green-100);
   --active-border: 1px solid var(--Colors-Primary-Primary-teal-600);
   --active-color: var(--Colors-Primary-Primary-teal-600);
+  --focus-border: 1px solid transparent;
 }
 
 .btn.secondary-cta {

diff --git a/packages/webapp/src/containers/AddSensors/Partners.tsx b/packages/webapp/src/containers/AddSensors/Partners.tsx
@@ -12,6 +12,7 @@
  *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  *  GNU General Public License for more details, see <https://www.gnu.org/licenses/>.
  */
+import { useEffect } from 'react';
 import PurePartners from '../../components/AddSensors/Partners';
 import { useGetFarmAddonQuery } from '../../store/api/apiSlice';
 import { PARTNERS } from './constants';
@@ -21,17 +22,23 @@ const Partners = ({
 }: {
   setIsEditing: React.Dispatch<React.SetStateAction<boolean>>;
 }) => {
-  const { data: esciData = [] } = useGetFarmAddonQuery(`?addon_partner_id=${PARTNERS.ESCI.id}`);
+  const { data: esciData = [], isLoading: esciLoading } = useGetFarmAddonQuery(
+    `?addon_partner_id=${PARTNERS.ESCI.id}`,
+  );
 
   const hasActiveConnection = {
     esci: esciData.length > 0,
   };
 
   const allConnectionsActive = Object.values(hasActiveConnection).every(Boolean);
 
-  setIsEditing(allConnectionsActive ? false : true);
+  const isLoading = esciLoading; // subsequent partner loading states here
 
-  return <PurePartners hasActiveConnection={hasActiveConnection} />;
+  useEffect(() => {
+    !isLoading && setIsEditing(allConnectionsActive ? false : true);
+  }, [allConnectionsActive, isLoading]);
+
+  return !isLoading && <PurePartners hasActiveConnection={hasActiveConnection} />;
 };
 
 export default Partners;