replace tooltip with external link

Author: olarclara

packages/app/src/app/pages/Pro/Upgrade.tsx

@@ -6,6 +6,7 @@ import {
   Element,
   Link as StyledLink,
   Tooltip,
+  Icon,
   Text,
 } from '@codesandbox/components';
 import { Helmet } from 'react-helmet';
@@ -361,40 +362,15 @@ export const ProUpgrade = () => {
                         </Caption>
 
                         <Caption css={{ paddingTop: 24 }}>
-                          <Element
-                            css={{
-                              color: '#999999',
-                              display: 'flex',
-                              alignItems: 'center',
-                            }}
+                          <StyledLink
+                            as={RouterLink}
+                            to={dashboardUrls.settings(activeTeam)}
                           >
-                            <StyledLink
-                              as={RouterLink}
-                              to={dashboardUrls.settings(activeTeam)}
-                            >
-                              Go to team settings
-                            </StyledLink>
-                            {/** Temporary copy. */}
-                            <Tooltip label="Manage team members and their roles.">
-                              <Element
-                                css={{ display: 'block', marginLeft: '.5em' }}
-                              >
-                                <svg
-                                  width="12"
-                                  height="12"
-                                  viewBox="0 0 12 12"
-                                  fill="none"
-                                  xmlns="http://www.w3.org/2000/svg"
-                                  style={{ display: 'block' }}
-                                >
-                                  <path
-                                    d="M6 10.625C3.44568 10.625 1.375 8.55432 1.375 6C1.375 3.44568 3.44568 1.375 6 1.375C8.55432 1.375 10.625 3.44568 10.625 6C10.625 8.55432 8.55432 10.625 6 10.625ZM0.625 6C0.625 8.96853 3.03147 11.375 6 11.375C8.96853 11.375 11.375 8.96853 11.375 6C11.375 3.03147 8.96853 0.625002 6 0.625002C3.03147 0.625002 0.625 3.03147 0.625 6ZM6 8.875C6.20711 8.875 6.375 8.70711 6.375 8.5V6C6.375 5.79289 6.20711 5.625 6 5.625C5.79289 5.625 5.625 5.79289 5.625 6V8.5C5.625 8.70711 5.79289 8.875 6 8.875ZM6 4.5C6.2071 4.5 6.375 4.33211 6.375 4.125L6.375 4.0625C6.375 3.8554 6.20711 3.6875 6 3.6875C5.7929 3.6875 5.625 3.85539 5.625 4.0625L5.625 4.125C5.625 4.3321 5.79289 4.5 6 4.5Z"
-                                    fill="#999999"
-                                  />
-                                </svg>
-                              </Element>
-                            </Tooltip>
-                          </Element>
+                            <Stack gap={2}>
+                              <span>Go to team settings</span>
+                              <Icon name="external" size={16} />
+                            </Stack>
+                          </StyledLink>
                         </Caption>
                       </Stack>