diff --git a/apps/code/src/renderer/features/integrations/hooks/useGithubUserConnect.ts b/apps/code/src/renderer/features/integrations/hooks/useGithubUserConnect.ts index 4191fdd20..5a210622a 100644 --- a/apps/code/src/renderer/features/integrations/hooks/useGithubUserConnect.ts +++ b/apps/code/src/renderer/features/integrations/hooks/useGithubUserConnect.ts @@ -6,6 +6,7 @@ import type { PostHogAPIClient } from "@renderer/api/posthogClient"; import { trpcClient } from "@renderer/trpc/client"; import { IS_DEV } from "@shared/constants/environment"; import { type QueryClient, useQueryClient } from "@tanstack/react-query"; +import { openUrlInBrowser } from "@utils/browser"; import { useCallback, useEffect, useMemo, useRef, useState } from "react"; const POLL_INTERVAL_MS = 3_000; @@ -91,14 +92,6 @@ export function invalidateGithubQueries( void queryClient.invalidateQueries({ queryKey: ["github_login"] }); } -export async function openUrlInBrowser(url: string): Promise { - try { - await trpcClient.os.openExternal.mutate({ url }); - } catch { - window.open(url, "_blank", "noopener,noreferrer"); - } -} - interface StateMachine { state: GithubUserConnectState; error: GithubUserConnectError | null; diff --git a/apps/code/src/renderer/features/settings/components/SettingsDialog.tsx b/apps/code/src/renderer/features/settings/components/SettingsDialog.tsx index dc35eadc2..c2d76c1ab 100644 --- a/apps/code/src/renderer/features/settings/components/SettingsDialog.tsx +++ b/apps/code/src/renderer/features/settings/components/SettingsDialog.tsx @@ -23,6 +23,7 @@ import { Keyboard, Palette, SignOut, + SlackLogo, TrafficSignal, TreeStructure, Wrench, @@ -40,6 +41,7 @@ import { PersonalizationSettings } from "./sections/PersonalizationSettings"; import { PlanUsageSettings } from "./sections/PlanUsageSettings"; import { ShortcutsSettings } from "./sections/ShortcutsSettings"; import { SignalSourcesSettings } from "./sections/SignalSourcesSettings"; +import { SlackSettings } from "./sections/SlackSettings"; import { UpdatesSettings } from "./sections/UpdatesSettings"; import { WorkspacesSettings } from "./sections/WorkspacesSettings"; import { WorktreesSettings } from "./sections/worktrees/WorktreesSettings"; @@ -69,6 +71,7 @@ const SIDEBAR_ITEMS: SidebarItem[] = [ { id: "claude-code", label: "Claude Code", icon: }, { id: "shortcuts", label: "Shortcuts", icon: }, { id: "github", label: "GitHub", icon: }, + { id: "slack", label: "Slack", icon: }, { id: "signals", @@ -90,6 +93,7 @@ const CATEGORY_TITLES: Record = { "claude-code": "Claude Code", shortcuts: "Shortcuts", github: "GitHub", + slack: "Slack integration", signals: "Signals", updates: "Updates", @@ -107,6 +111,7 @@ const CATEGORY_COMPONENTS: Record = { "claude-code": ClaudeCodeSettings, shortcuts: ShortcutsSettings, github: GitHubSettings, + slack: SlackSettings, signals: SignalSourcesSettings, updates: UpdatesSettings, diff --git a/apps/code/src/renderer/features/settings/components/sections/GitHubSettings.tsx b/apps/code/src/renderer/features/settings/components/sections/GitHubSettings.tsx index 0fc2010e4..0bf77e260 100644 --- a/apps/code/src/renderer/features/settings/components/sections/GitHubSettings.tsx +++ b/apps/code/src/renderer/features/settings/components/sections/GitHubSettings.tsx @@ -3,7 +3,6 @@ import { useAuthStateValue } from "@features/auth/hooks/authQueries"; import { describeGithubConnectError, invalidateGithubQueries, - openUrlInBrowser, useGithubUserConnect, } from "@features/integrations/hooks/useGithubUserConnect"; import { @@ -33,6 +32,7 @@ import type { UserGitHubIntegration } from "@renderer/api/posthogClient"; import { formatRelativeTimeLong } from "@renderer/utils/time"; import { toast } from "@renderer/utils/toast"; import { useMutation, useQueryClient } from "@tanstack/react-query"; +import { openUrlInBrowser } from "@utils/browser"; import { useState } from "react"; const REPO_PREVIEW_COUNT = 3; diff --git a/apps/code/src/renderer/features/settings/components/sections/SlackSettings.tsx b/apps/code/src/renderer/features/settings/components/sections/SlackSettings.tsx new file mode 100644 index 000000000..29641831e --- /dev/null +++ b/apps/code/src/renderer/features/settings/components/sections/SlackSettings.tsx @@ -0,0 +1,48 @@ +import { useAuthStateValue } from "@features/auth/hooks/authQueries"; +import { ArrowSquareOutIcon } from "@phosphor-icons/react"; +import { Button, Flex, Text, Tooltip } from "@radix-ui/themes"; +import { openUrlInBrowser } from "@utils/browser"; +import { getPostHogUrl } from "@utils/urls"; + +export function SlackSettings() { + const projectId = useAuthStateValue((s) => s.projectId); + const cloudRegion = useAuthStateValue((s) => s.cloudRegion); + + const slackSettingsUrl = projectId + ? getPostHogUrl( + `/project/${projectId}/settings/project-posthog-code#integration-posthog-code-slack`, + cloudRegion, + ) + : null; + + const button = ( + + ); + + return ( + + + Connect Slack to PostHog Code to kick off tasks like pull requests + directly from Slack. + + + {slackSettingsUrl ? ( + button + ) : ( + + {button} + + )} + + + ); +} diff --git a/apps/code/src/renderer/features/settings/stores/settingsDialogStore.ts b/apps/code/src/renderer/features/settings/stores/settingsDialogStore.ts index b17c8ce59..046baf1df 100644 --- a/apps/code/src/renderer/features/settings/stores/settingsDialogStore.ts +++ b/apps/code/src/renderer/features/settings/stores/settingsDialogStore.ts @@ -11,6 +11,7 @@ export type SettingsCategory = | "claude-code" | "shortcuts" | "github" + | "slack" | "signals" | "updates" | "advanced"; diff --git a/apps/code/src/renderer/utils/browser.ts b/apps/code/src/renderer/utils/browser.ts new file mode 100644 index 000000000..157a84f92 --- /dev/null +++ b/apps/code/src/renderer/utils/browser.ts @@ -0,0 +1,9 @@ +import { trpcClient } from "@renderer/trpc/client"; + +export async function openUrlInBrowser(url: string): Promise { + try { + await trpcClient.os.openExternal.mutate({ url }); + } catch { + window.open(url, "_blank", "noopener,noreferrer"); + } +}