From ee95719f8cfb861bdd3487b5943a2508632ff26f Mon Sep 17 00:00:00 2001
From: Sam Becker <sam@sambecker.com>
Date: Wed, 19 Jun 2024 23:21:39 -0500
Subject: [PATCH] Use responsive text component

---
 src/admin/AdminOutdatedClient.tsx | 12 ++++--------
 1 file changed, 4 insertions(+), 8 deletions(-)

diff --git a/src/admin/AdminOutdatedClient.tsx b/src/admin/AdminOutdatedClient.tsx
index 77f09d09..80b7db80 100644
--- a/src/admin/AdminOutdatedClient.tsx
+++ b/src/admin/AdminOutdatedClient.tsx
@@ -10,6 +10,7 @@ import { PATH_ADMIN_PHOTOS } from '@/site/paths';
 import { useState } from 'react';
 import { syncPhotosAction } from '@/photo/actions';
 import { useRouter } from 'next/navigation';
+import ResponsiveText from '@/components/primitives/ResponsiveText';
 
 const UPDATE_BATCH_SIZE = 4;
 
@@ -67,14 +68,9 @@ export default function AdminOutdatedClient({
       >
         {arePhotoIdsSyncing
           ? 'Syncing'
-          : <>
-            <span className="hidden sm:inline-block">
-              Sync Next {UPDATE_BATCH_SIZE} Photos
-            </span>
-            <span className="sm:hidden">
-              Sync Next {UPDATE_BATCH_SIZE}
-            </span>
-          </>}
+          : <ResponsiveText shortText={`Sync Next ${UPDATE_BATCH_SIZE}`}>
+            Sync Next {UPDATE_BATCH_SIZE} Photos
+          </ResponsiveText>}
       </LoaderButton>}
     >
       <div className="space-y-6">