chore: modify text on group detail page (#62)

* chore(group): modify text of contact box * fix: adjust text on group detail page
daodaoedu · Jul 21, 2024 · 4fe25c9 · 4fe25c9
1 parent 5c9f06a
commit 4fe25c9
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 15 deletions.
diff --git a/components/Group/detail/Contact/index.jsx b/components/Group/detail/Contact/index.jsx
@@ -242,7 +242,7 @@ function ContactButton({
               id={contactId}
               value={contact}
               onChange={(e) => setContact(e.target.value)}
-              placeholder="寫下您的聯繫資訊，如 e-mail、line、Facebook、Instagram 等等。"
+              placeholder="寫下您的聯絡資訊，初次聯繫建議提供「想公開的社群媒體帳號、email」即可。"
             />
           </div>
 

diff --git a/components/Group/detail/OrganizerCard.jsx b/components/Group/detail/OrganizerCard.jsx
@@ -75,7 +75,9 @@ function OrganizerCard({ data = {}, isLoading }) {
     ROLE.find(({ key }) => data?.user?.roleList?.includes(key))?.label ||
     '暫無資料';
   const location =
-    data?.user?.location === 'tw' ? '台灣' : data?.user?.location;
+    data?.user?.location === 'tw'
+      ? '台灣'
+      : data?.user?.location.replace('台灣', '').split('@').join(' ');
 
   return (
     <>

diff --git a/components/Group/detail/TeamInfoCard.jsx b/components/Group/detail/TeamInfoCard.jsx
@@ -46,47 +46,39 @@ const StyledItem = styled.div`
   }
 `;
 
+const format = (value) =>
+  Array.isArray(value) ? value.filter(Boolean).join('、') : value;
+
 const labels = [
   {
     key: 'category',
     icon: categorySvg.src,
     text: '學習領域',
-    format: (v) => (Array.isArray(v) ? v.join('、') : v),
   },
   {
     key: 'area',
     icon: locationSvg.src,
     text: '地點',
-    format: (v) => (Array.isArray(v) ? v.join('、') : v),
   },
   { key: 'time', icon: clockSvg.src, text: '時間' },
   { key: 'partnerStyle', icon: personSvg.src, text: '想找的夥伴' },
   {
     key: 'partnerEducationStep',
     icon: bachelorCapSvg.src,
     text: '適合的教育階段',
-    format: (v) => (Array.isArray(v) ? v.join('、') : v),
   },
 ];
 
 function TeamInfoCard({ data = {}, isLoading }) {
   return labels.map(
-    ({ key, icon, text, format }) =>
+    ({ key, icon, text }) =>
       data[key] && (
         <StyledItem key={key}>
           <h3>
             <img src={icon} alt={`${text} icon`} />
             {text}
           </h3>
-          <p>
-            {isLoading ? (
-              <Skeleton animation="wave" />
-            ) : typeof format === 'function' ? (
-              format(data[key])
-            ) : (
-              data[key]
-            )}
-          </p>
+          <p>{isLoading ? <Skeleton animation="wave" /> : format(data[key])}</p>
         </StyledItem>
       ),
   );