feat: enhance admin and contact components with new functionality

- Updated `AdminPage` to conditionally display duty reassignment instructions based on visible groups, improving user guidance.
- Refactored `AdminDutyList` to streamline the display of duties, enhancing visual clarity and organization.
- Introduced `openPhoneLink` and `triggerHapticLight` functions in `ContactLinks` for improved phone link interaction and haptic feedback.
- Added unit tests for `openPhoneLink` to ensure correct functionality and handling of various phone number formats.
- Enhanced existing tests for `ContactLinks` to verify new phone link behavior, ensuring robust testing coverage.

webapp-next/src/app/admin/page.tsx

@@ -57,7 +57,7 @@ export default function AdminPage() {
 
   return (
     <div className={PAGE_WRAPPER_CLASS}>
-      <header className="sticky top-0 z-10 flex flex-col items-center border-b bg-[var(--header-bg)] py-3">
+      <header className="sticky top-0 z-10 flex flex-col items-center border-b border-border bg-background py-3">
         <div className="flex w-full items-center justify-between px-1">
           <Button
             type="button"
@@ -121,9 +121,11 @@ export default function AdminPage() {
 
       {!admin.loading && !admin.error && (
         <div className="mt-3 flex flex-col gap-2">
-          <p className="text-sm text-muted-foreground">
-            {t("admin.reassign_duty")}: {t("admin.select_user")}
-          </p>
+          {admin.visibleGroups.length > 0 && (
+            <p className="text-sm text-muted-foreground">
+              {t("admin.reassign_duty")}: {t("admin.select_user")}
+            </p>
+          )}
           <AdminDutyList
             groups={admin.visibleGroups}
             hasMore={admin.hasMore}