add team manager role

src/app/(main)/settings/teams/[teamId]/members/TeamMemberEditForm.tsx

@@ -40,6 +40,9 @@ export function TeamMemberEditForm({
   };
 
   const renderValue = (value: string) => {
+    if (value === ROLES.teamManager) {
+      return formatMessage(labels.manager);
+    }
     if (value === ROLES.teamMember) {
       return formatMessage(labels.member);
     }
@@ -58,6 +61,7 @@ export function TeamMemberEditForm({
               minWidth: '250px',
             }}
           >
+            <Item key={ROLES.teamManager}>{formatMessage(labels.manager)}</Item>
             <Item key={ROLES.teamMember}>{formatMessage(labels.member)}</Item>
             <Item key={ROLES.teamViewOnly}>{formatMessage(labels.viewOnly)}</Item>
           </Dropdown>

src/app/(main)/settings/teams/[teamId]/members/TeamMembersPage.tsx

@@ -12,8 +12,10 @@ export function TeamMembersPage({ teamId }: { teamId: string }) {
   const { formatMessage, labels } = useMessages();
 
   const canEdit =
-    team?.teamUser?.find(({ userId, role }) => role === ROLES.teamOwner && userId === user.id) &&
+    team?.teamUser?.find(
-    user.role !== ROLES.viewOnly;
+      ({ userId, role }) =>
+        (role === ROLES.teamOwner || role === ROLES.teamManager) && userId === user.id,
+    ) && user.role !== ROLES.viewOnly;
 
   return (
     <>

src/app/(main)/settings/teams/[teamId]/members/TeamMembersTable.tsx

@@ -19,6 +19,7 @@ export function TeamMembersTable({
 
   const roles = {
     [ROLES.teamOwner]: formatMessage(labels.teamOwner),
+    [ROLES.teamManager]: formatMessage(labels.teamManager),
     [ROLES.teamMember]: formatMessage(labels.teamMember),
     [ROLES.teamViewOnly]: formatMessage(labels.viewOnly),
   };

src/app/(main)/settings/teams/[teamId]/team/TeamDetails.tsx

@@ -15,18 +15,24 @@ export function TeamDetails({ teamId }: { teamId: string }) {
   const { user } = useLogin();
   const [tab, setTab] = useState('details');
 
-  const canEdit =
+  const isTeamOwner =
     !!team?.teamUser?.find(({ userId, role }) => role === ROLES.teamOwner && userId === user.id) &&
     user.role !== ROLES.viewOnly;
 
+  const canEdit =
+    !!team?.teamUser?.find(
+      ({ userId, role }) =>
+        (role === ROLES.teamOwner || role === ROLES.teamManager) && userId === user.id,
+    ) && user.role !== ROLES.viewOnly;
+
   return (
     <Flexbox direction="column">
       <PageHeader title={team?.name} icon={<Icons.Users />}>
-        {!canEdit && <TeamLeaveButton teamId={team.id} teamName={team.name} />}
+        {!isTeamOwner && <TeamLeaveButton teamId={team.id} teamName={team.name} />}
       </PageHeader>
       <Tabs selectedKey={tab} onSelect={(value: any) => setTab(value)} style={{ marginBottom: 30 }}>
         <Item key="details">{formatMessage(labels.details)}</Item>
-        {canEdit && <Item key="manage">{formatMessage(labels.manage)}</Item>}
+        {isTeamOwner && <Item key="manage">{formatMessage(labels.manage)}</Item>}
       </Tabs>
       {tab === 'details' && <TeamEditForm teamId={teamId} allowEdit={canEdit} />}
       {tab === 'manage' && <TeamManage teamId={teamId} />}

src/components/messages.ts

@@ -29,6 +29,7 @@ export const labels = defineMessages({
   createdBy: { id: 'label.created-by', defaultMessage: 'Created By' },
   edit: { id: 'label.edit', defaultMessage: 'Edit' },
   name: { id: 'label.name', defaultMessage: 'Name' },
+  manager: { id: 'label.manager', defaultMessage: 'Manager' },
   member: { id: 'label.member', defaultMessage: 'Member' },
   members: { id: 'label.members', defaultMessage: 'Members' },
   accessCode: { id: 'label.access-code', defaultMessage: 'Access code' },
@@ -43,6 +44,7 @@ export const labels = defineMessages({
   settings: { id: 'label.settings', defaultMessage: 'Settings' },
   owner: { id: 'label.owner', defaultMessage: 'Owner' },
   teamOwner: { id: 'label.team-owner', defaultMessage: 'Team owner' },
+  teamManager: { id: 'label.team-manager', defaultMessage: 'Team manager' },
   teamMember: { id: 'label.team-member', defaultMessage: 'Team member' },
   teamViewOnly: { id: 'label.team-view-only', defaultMessage: 'Team view only' },
   enableShareUrl: { id: 'label.enable-share-url', defaultMessage: 'Enable share URL' },

src/components/metrics/PagesTable.tsx

@@ -38,7 +38,11 @@ export function PagesTable({ allowFilter, domainName, ...props }: PagesTableProp
         id={view}
         value={x}
         label={!x && formatMessage(labels.none)}
-        externalUrl={`${domainName.startsWith('http') ? domainName : `https://${domainName}`}${x}`}
+        externalUrl={
+          view === 'url'
+            ? `${domainName.startsWith('http') ? domainName : `https://${domainName}`}${x}`
+            : null
+        }
       />
     );
   };

src/lib/constants.ts

@@ -132,6 +132,7 @@ export const ROLES = {
   user: 'user',
   viewOnly: 'view-only',
   teamOwner: 'team-owner',
+  teamManager: 'team-manager',
   teamMember: 'team-member',
   teamViewOnly: 'team-view-only',
 } as const;
@@ -162,6 +163,12 @@ export const ROLE_PERMISSIONS = {
     PERMISSIONS.websiteUpdate,
     PERMISSIONS.websiteDelete,
   ],
+  [ROLES.teamManager]: [
+    PERMISSIONS.teamUpdate,
+    PERMISSIONS.websiteCreate,
+    PERMISSIONS.websiteUpdate,
+    PERMISSIONS.websiteDelete,
+  ],
   [ROLES.teamMember]: [
     PERMISSIONS.websiteCreate,
     PERMISSIONS.websiteUpdate,

src/pages/api/teams/[teamId]/users/[userId].ts

@@ -23,7 +23,7 @@ const schema = {
   POST: yup.object().shape({
     role: yup
       .string()
-      .matches(/team-member|team-view-only/i)
+      .matches(/team-member|team-view-only|team-manager/i)
       .required(),
   }),
 };

src/pages/api/teams/[teamId]/users/index.ts

@@ -25,7 +25,7 @@ const schema = {
     userId: yup.string().uuid().required(),
     role: yup
       .string()
-      .matches(/team-member|team-view-only/i)
+      .matches(/team-member|team-view-only|team-manager/i)
       .required(),
   }),
 };