Changed route ids to be more explicit.

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

@@ -1,6 +1,6 @@
 'use client';
 import { useState } from 'react';
-import { Item, Loading, Tabs, Flexbox } from 'react-basics';
+import { Item, Loading, Tabs, Flexbox, Text, Icon } from 'react-basics';
 import TeamsContext from 'app/(main)/teams/TeamsContext';
 import PageHeader from 'components/layout/PageHeader';
 import { ROLES } from 'lib/constants';
@@ -10,6 +10,7 @@ import TeamEditForm from './TeamEditForm';
 import TeamMembers from './TeamMembers';
 import TeamWebsites from './TeamWebsites';
 import TeamData from './TeamData';
+import LinkButton from 'components/common/LinkButton';
 
 export function TeamSettings({ teamId }: { teamId: string }) {
   const { formatMessage, labels } = useMessages();
@@ -28,7 +29,14 @@ export function TeamSettings({ teamId }: { teamId: string }) {
   return (
     <TeamsContext.Provider value={team}>
       <Flexbox direction="column">
-        <PageHeader title={team?.name} icon={<Icons.Users />} />
+        <PageHeader title={team?.name} icon={<Icons.Users />}>
+          <LinkButton href={`/teams/${teamId}`} variant="primary">
+            <Icon>
+              <Icons.External />
+            </Icon>
+            <Text>{formatMessage(labels.view)}</Text>
+          </LinkButton>
+        </PageHeader>
         <Tabs
           selectedKey={tab}
           onSelect={(value: any) => setTab(value)}

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

@@ -1,9 +1,9 @@
 import TeamSettings from './TeamSettings';
 
-export default function ({ params }) {
+export default function ({ params: { teamId } }) {
   if (process.env.cloudMode) {
     return null;
   }
 
-  return <TeamSettings teamId={params.id} />;
+  return <TeamSettings teamId={teamId} />;
 }