chore: related docs in settings

Signed-off-by: Siddhant Khare <[email protected]>

Author: Siddhant-K-code

components/dashboard/src/components/BillingAccountSelector.tsx

@@ -96,7 +96,17 @@ export function BillingAccountSelector(props: { onSelected?: () => void }) {
             {teamsAvailableForAttribution === undefined && <Spinner className="m-2 h-5 w-5 animate-spin" />}
             {teamsAvailableForAttribution && (
                 <div>
-                    <p>Associate usage without a project to the billing account below.</p>
+                    <h2 className="text-gray-500">
+                        Associate usage without a project to the billing account below.{" "}
+                        <a
+                            className="gp-link"
+                            href="https://www.gitpod.io/docs/configure/billing"
+                            target="_blank"
+                            rel="noreferrer"
+                        >
+                            Learn more
+                        </a>
+                    </h2>
                     <div className="mt-4 max-w-2xl grid grid-cols-3 gap-3">
                         <SelectableCardSolid
                             className="h-18"

components/dashboard/src/settings/EnvironmentVariables.tsx

@@ -222,7 +222,17 @@ export default function EnvVars() {
             <div className="flex items-start sm:justify-between mb-2">
                 <div>
                     <h3>Environment Variables</h3>
-                    <h2 className="text-gray-500">Variables are used to store information like passwords.</h2>
+                    <h2 className="text-gray-500">
+                        Variables are used to store information like passwords.{" "}
+                        <a
+                            className="gp-link"
+                            href="https://www.gitpod.io/docs/configure/projects/environment-variables#environment-variables"
+                            target="_blank"
+                            rel="noreferrer"
+                        >
+                            Learn more
+                        </a>
+                    </h2>
                 </div>
                 {envVars.length !== 0 ? (
                     <div className="mt-3 flex mt-0">
@@ -238,13 +248,7 @@ export default function EnvVars() {
                         <h3 className="text-center pb-3 text-gray-500 dark:text-gray-400">No Environment Variables</h3>
                         <div className="text-center pb-6 text-gray-500">
                             In addition to user-specific environment variables you can also pass variables through a
-                            workspace creation URL.{" "}
-                            <a
-                                className="gp-link"
-                                href="https://www.gitpod.io/docs/environment-variables/#using-the-account-settings"
-                            >
-                                Learn more
-                            </a>
+                            workspace creation URL.
                         </div>
                         <button onClick={add}>New Variable</button>
                     </div>

components/dashboard/src/settings/Integrations.tsx

@@ -320,7 +320,17 @@ function GitProviders() {
             )}
 
             <h3>Git Providers</h3>
-            <h2>Manage permissions for Git providers.</h2>
+            <h2 className="text-gray-500">
+                Manage permissions for Git providers.{" "}
+                <a
+                    className="gp-link"
+                    href="https://www.gitpod.io/docs/configure/authentication"
+                    target="_blank"
+                    rel="noreferrer"
+                >
+                    Learn more
+                </a>
+            </h2>
             <ItemsList className="pt-6">
                 {authProviders &&
                     authProviders.map((ap) => (

components/dashboard/src/settings/PersonalAccessTokens.tsx

@@ -156,7 +156,26 @@ function ListAccessTokensView() {
                             </a>
                         </PillLabel>
                     </h3>
-                    <h2 className="text-gray-500">Create or regenerate access tokens.</h2>
+                    <h2 className="text-gray-500">
+                        Create or regenerate access tokens.{" "}
+                        <a
+                            className="gp-link"
+                            href="https://www.gitpod.io/docs/configure/user-settings/access-tokens"
+                            target="_blank"
+                            rel="noreferrer"
+                        >
+                            Learn more
+                        </a>
+                        &nbsp;&middot;&nbsp;
+                        <a
+                            className="gp-link"
+                            href="https://github.com/gitpod-io/gitpod/issues/15433"
+                            target="_blank"
+                            rel="noreferrer"
+                        >
+                            Send feedback
+                        </a>
+                    </h2>
                 </div>
                 {tokens.length > 0 && (
                     <Link to={settingsPathPersonalAccessTokenCreate}>

components/dashboard/src/settings/Preferences.tsx

@@ -51,7 +51,17 @@ export default function Preferences() {
         <div>
             <PageWithSettingsSubMenu title="Preferences" subtitle="Configure user preferences.">
                 <h3>Editor</h3>
-                <p className="text-base text-gray-500 dark:text-gray-400">Choose the editor for opening workspaces.</p>
+                <p className="text-base text-gray-500 dark:text-gray-400">
+                    Choose the editor for opening workspaces.{" "}
+                    <a
+                        className="gp-link"
+                        href="https://www.gitpod.io/docs/references/ides-and-editors"
+                        target="_blank"
+                        rel="noreferrer"
+                    >
+                        Learn more
+                    </a>
+                </p>
                 <SelectIDE location="preferences" />
                 <h3 className="mt-12">Theme</h3>
                 <p className="text-base text-gray-500 dark:text-gray-400">Early bird or night owl? Choose your side.</p>

components/dashboard/src/settings/SSHKeys.tsx

@@ -188,7 +188,17 @@ export default function SSHKeys() {
             <div className="flex items-start sm:justify-between mb-2">
                 <div>
                     <h3>SSH Keys</h3>
-                    <h2 className="text-gray-500">Create and manage SSH keys.</h2>
+                    <h2 className="text-gray-500">
+                        Create and manage SSH keys.{" "}
+                        <a
+                            className="gp-link"
+                            href="https://www.gitpod.io/docs/configure/user-settings/ssh"
+                            target="_blank"
+                            rel="noreferrer"
+                        >
+                            Learn more
+                        </a>
+                    </h2>
                 </div>
                 {dataList.length !== 0 ? (
                     <div className="mt-3 flex">