feat(desktop): add documentation links throughout the app

apps/desktop/src/main/lib/menu.ts

@@ -80,6 +80,13 @@ export function createApplicationMenu() {
 		{
 			label: "Help",
 			submenu: [
+				{
+					label: "Documentation",
+					click: () => {
+						shell.openExternal(COMPANY.DOCS_URL);
+					},
+				},
+				{ type: "separator" },
 				{
 					label: "Contact Us",
 					click: () => {

apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/TopBar/components/OrganizationDropdown/OrganizationDropdown.tsx

@@ -14,17 +14,19 @@ import {
 } from "@superset/ui/dropdown-menu";
 import { useLiveQuery } from "@tanstack/react-db";
 import { useNavigate } from "@tanstack/react-router";
-import { FaDiscord, FaXTwitter } from "react-icons/fa6";
+import { FaDiscord, FaGithub, FaXTwitter } from "react-icons/fa6";
+import { FiUsers } from "react-icons/fi";
 import {
 	HiCheck,
 	HiChevronUpDown,
 	HiOutlineArrowRightOnRectangle,
-	HiOutlineBugAnt,
+	HiOutlineBookOpen,
+	HiOutlineChatBubbleLeftRight,
 	HiOutlineCog6Tooth,
 	HiOutlineEnvelope,
-	HiOutlineUserGroup,
 } from "react-icons/hi2";
-import { LuKeyboard, LuLifeBuoy } from "react-icons/lu";
+import { IoBugOutline } from "react-icons/io5";
+import { LuKeyboard } from "react-icons/lu";
 import { authClient } from "renderer/lib/auth-client";
 import { electronTrpc } from "renderer/lib/electron-trpc";
 import { useCollections } from "renderer/routes/_authenticated/providers/CollectionsProvider";
@@ -92,6 +94,7 @@ export function OrganizationDropdown() {
 				</button>
 			</DropdownMenuTrigger>
 			<DropdownMenuContent align="end" className="w-56">
+				{/* Organization */}
 				<DropdownMenuItem
 					onSelect={() => navigate({ to: "/settings/account" })}
 				>
@@ -101,57 +104,51 @@ export function OrganizationDropdown() {
 						<DropdownMenuShortcut>{settingsHotkey}</DropdownMenuShortcut>
 					)}
 				</DropdownMenuItem>
-
 				<DropdownMenuItem
 					onSelect={() => navigate({ to: "/settings/organization" })}
 				>
-					<HiOutlineUserGroup className="h-4 w-4" />
-					<span>Invite and manage members</span>
+					<FiUsers className="h-4 w-4" />
+					<span>Manage members</span>
 				</DropdownMenuItem>
-
-				<DropdownMenuSeparator />
-
 				{organizations && organizations.length > 1 && (
-					<>
-						<DropdownMenuSub>
-							<DropdownMenuSubTrigger className="gap-2">
-								<span>Switch organization</span>
-							</DropdownMenuSubTrigger>
-							<DropdownMenuSubContent>
-								{userEmail && (
-									<DropdownMenuLabel className="font-normal text-muted-foreground text-xs">
-										{userEmail}
-									</DropdownMenuLabel>
-								)}
-								{organizations.map((organization) => (
-									<DropdownMenuItem
-										key={organization.id}
-										onSelect={() => switchOrganization(organization.id)}
-										className="gap-2"
-									>
-										<Avatar
-											size="xs"
-											fullName={organization.name}
-											image={organization.logo}
-											className="rounded-md"
-										/>
-										<span className="flex-1 truncate">{organization.name}</span>
-										{organization.id === activeOrganization?.id && (
-											<HiCheck className="h-4 w-4 text-primary" />
-										)}
-									</DropdownMenuItem>
-								))}
-							</DropdownMenuSubContent>
-						</DropdownMenuSub>
-						<DropdownMenuSeparator />
-					</>
+					<DropdownMenuSub>
+						<DropdownMenuSubTrigger className="gap-2">
+							<span>Switch organization</span>
+						</DropdownMenuSubTrigger>
+						<DropdownMenuSubContent>
+							{userEmail && (
+								<DropdownMenuLabel className="font-normal text-muted-foreground text-xs">
+									{userEmail}
+								</DropdownMenuLabel>
+							)}
+							{organizations.map((organization) => (
+								<DropdownMenuItem
+									key={organization.id}
+									onSelect={() => switchOrganization(organization.id)}
+									className="gap-2"
+								>
+									<Avatar
+										size="xs"
+										fullName={organization.name}
+										image={organization.logo}
+										className="rounded-md"
+									/>
+									<span className="flex-1 truncate">{organization.name}</span>
+									{organization.id === activeOrganization?.id && (
+										<HiCheck className="h-4 w-4 text-primary" />
+									)}
+								</DropdownMenuItem>
+							))}
+						</DropdownMenuSubContent>
+					</DropdownMenuSub>
 				)}
 
-				<DropdownMenuItem
-					onClick={() => openExternal(COMPANY.REPORT_ISSUE_URL)}
-				>
-					<HiOutlineBugAnt className="h-4 w-4" />
-					Report Issue
+				<DropdownMenuSeparator />
+
+				{/* Help & Support */}
+				<DropdownMenuItem onClick={() => openExternal(COMPANY.DOCS_URL)}>
+					<HiOutlineBookOpen className="h-4 w-4" />
+					Documentation
 				</DropdownMenuItem>
 				<DropdownMenuItem
 					onClick={() => navigate({ to: "/settings/keyboard" })}
@@ -162,12 +159,22 @@ export function OrganizationDropdown() {
 						<DropdownMenuShortcut>{shortcutsHotkey}</DropdownMenuShortcut>
 					)}
 				</DropdownMenuItem>
+				<DropdownMenuItem
+					onClick={() => openExternal(COMPANY.REPORT_ISSUE_URL)}
+				>
+					<IoBugOutline className="h-4 w-4" />
+					Report Issue
+				</DropdownMenuItem>
 				<DropdownMenuSub>
 					<DropdownMenuSubTrigger>
-						<LuLifeBuoy className="h-4 w-4" />
+						<HiOutlineChatBubbleLeftRight className="h-4 w-4" />
 						Contact Us
 					</DropdownMenuSubTrigger>
 					<DropdownMenuSubContent sideOffset={8} className="w-56">
+						<DropdownMenuItem onClick={() => openExternal(COMPANY.GITHUB_URL)}>
+							<FaGithub className="h-4 w-4" />
+							GitHub
+						</DropdownMenuItem>
 						<DropdownMenuItem onClick={() => openExternal(COMPANY.DISCORD_URL)}>
 							<FaDiscord className="h-4 w-4" />
 							Discord
@@ -184,6 +191,7 @@ export function OrganizationDropdown() {
 
 				<DropdownMenuSeparator />
 
+				{/* Account */}
 				<DropdownMenuItem onSelect={handleSignOut} className="gap-2">
 					<HiOutlineArrowRightOnRectangle className="h-4 w-4" />
 					<span>Log out</span>

apps/desktop/src/renderer/routes/_authenticated/settings/api-keys/components/ApiKeysSettings/ApiKeysSettings.tsx

@@ -1,3 +1,4 @@
+import { COMPANY } from "@superset/shared/constants";
 import { alert } from "@superset/ui/atoms/Alert";
 import { Badge } from "@superset/ui/badge";
 import { Button } from "@superset/ui/button";
@@ -24,6 +25,7 @@ import {
 import { useLiveQuery } from "@tanstack/react-db";
 import { useState } from "react";
 import {
+	HiArrowTopRightOnSquare,
 	HiOutlineClipboardDocument,
 	HiOutlineKey,
 	HiOutlinePlus,
@@ -119,7 +121,16 @@ export function ApiKeysSettings({ visibleItems }: ApiKeysSettingsProps) {
 				<div className="max-w-5xl">
 					<h2 className="text-2xl font-semibold">API Keys</h2>
 					<p className="text-sm text-muted-foreground mt-1">
-						Manage API keys for MCP server access and external integrations
+						Manage API keys for MCP server access and external integrations.{" "}
+						<a
+							href={`${COMPANY.DOCS_URL}/mcp`}
+							target="_blank"
+							rel="noopener noreferrer"
+							className="inline-flex items-center gap-1 text-primary hover:underline"
+						>
+							Learn more
+							<HiArrowTopRightOnSquare className="h-3 w-3" />
+						</a>
 					</p>
 				</div>
 			</div>

apps/desktop/src/renderer/routes/_authenticated/settings/components/SettingsSidebar/SettingsSidebar.tsx

@@ -1,5 +1,11 @@
+import { COMPANY } from "@superset/shared/constants";
 import { Link } from "@tanstack/react-router";
-import { HiArrowLeft, HiMagnifyingGlass, HiXMark } from "react-icons/hi2";
+import {
+	HiArrowLeft,
+	HiArrowTopRightOnSquare,
+	HiMagnifyingGlass,
+	HiXMark,
+} from "react-icons/hi2";
 import {
 	useSetSettingsSearchQuery,
 	useSettingsSearchQuery,
@@ -52,6 +58,18 @@ export function SettingsSidebar() {
 				<GeneralSettings matchCounts={matchCounts} />
 				<ProjectsSettings searchQuery={searchQuery} />
 			</div>
+
+			<div className="pt-3 mt-3 border-t border-border">
+				<a
+					href={COMPANY.DOCS_URL}
+					target="_blank"
+					rel="noopener noreferrer"
+					className="flex items-center gap-2 px-3 py-1.5 text-sm text-muted-foreground hover:text-foreground transition-colors"
+				>
+					<HiArrowTopRightOnSquare className="h-4 w-4" />
+					<span>Documentation</span>
+				</a>
+			</div>
 		</div>
 	);
 }

apps/desktop/src/renderer/routes/_authenticated/settings/integrations/components/IntegrationsSettings/IntegrationsSettings.tsx

@@ -1,4 +1,4 @@
-import { FEATURE_FLAGS } from "@superset/shared/constants";
+import { COMPANY, FEATURE_FLAGS } from "@superset/shared/constants";
 import { Badge } from "@superset/ui/badge";
 import { Button } from "@superset/ui/button";
 import {
@@ -189,7 +189,16 @@ export function IntegrationsSettings({
 			</div>
 
 			<p className="mt-6 text-xs text-muted-foreground">
-				Manage integrations in the web app to connect and configure services.
+				Manage integrations in the web app to connect and configure services.{" "}
+				<a
+					href={`${COMPANY.DOCS_URL}/integrations`}
+					target="_blank"
+					rel="noopener noreferrer"
+					className="inline-flex items-center gap-1 text-primary hover:underline"
+				>
+					Learn more
+					<HiOutlineArrowTopRightOnSquare className="h-3 w-3" />
+				</a>
 			</p>
 		</div>
 	);