import { Button } from "@/components/ui/button";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { cn } from "@/lib/utils";
import {
ChevronDownIcon,
ExternalLinkIcon,
MessageCircleIcon,
} from "lucide-react";
import { type ComponentProps, createContext, useContext } from "react";
const providers = {
github: {
title: "Open in GitHub",
createUrl: (url: string) => url,
icon: (
),
},
scira: {
title: "Open in Scira",
createUrl: (q: string) =>
`https://scira.ai/?${new URLSearchParams({
q,
})}`,
icon: (
),
},
chatgpt: {
title: "Open in ChatGPT",
createUrl: (prompt: string) =>
`https://chatgpt.com/?${new URLSearchParams({
hints: "search",
prompt,
})}`,
icon: (
),
},
claude: {
title: "Open in Claude",
createUrl: (q: string) =>
`https://claude.ai/new?${new URLSearchParams({
q,
})}`,
icon: (
),
},
t3: {
title: "Open in T3 Chat",
createUrl: (q: string) =>
`https://t3.chat/new?${new URLSearchParams({
q,
})}`,
icon: ,
},
v0: {
title: "Open in v0",
createUrl: (q: string) =>
`https://v0.app?${new URLSearchParams({
q,
})}`,
icon: (
),
},
cursor: {
title: "Open in Cursor",
createUrl: (text: string) => {
const url = new URL("https://cursor.com/link/prompt");
url.searchParams.set("text", text);
return url.toString();
},
icon: (
),
},
};
const OpenInContext = createContext<{ query: string } | undefined>(undefined);
const useOpenInContext = () => {
const context = useContext(OpenInContext);
if (!context) {
throw new Error("OpenIn components must be used within an OpenIn provider");
}
return context;
};
export type OpenInProps = ComponentProps & {
query: string;
};
export const OpenIn = ({ query, ...props }: OpenInProps) => (
);
export type OpenInContentProps = ComponentProps;
export const OpenInContent = ({ className, ...props }: OpenInContentProps) => (
);
export type OpenInItemProps = ComponentProps;
export const OpenInItem = (props: OpenInItemProps) => (
);
export type OpenInLabelProps = ComponentProps;
export const OpenInLabel = (props: OpenInLabelProps) => (
);
export type OpenInSeparatorProps = ComponentProps;
export const OpenInSeparator = (props: OpenInSeparatorProps) => (
);
export type OpenInTriggerProps = ComponentProps;
export const OpenInTrigger = ({ children, ...props }: OpenInTriggerProps) => (
{children ?? (
)}
);
export type OpenInChatGPTProps = ComponentProps;
export const OpenInChatGPT = (props: OpenInChatGPTProps) => {
const { query } = useOpenInContext();
return (
{providers.chatgpt.icon}
{providers.chatgpt.title}
);
};
export type OpenInClaudeProps = ComponentProps;
export const OpenInClaude = (props: OpenInClaudeProps) => {
const { query } = useOpenInContext();
return (
{providers.claude.icon}
{providers.claude.title}
);
};
export type OpenInT3Props = ComponentProps;
export const OpenInT3 = (props: OpenInT3Props) => {
const { query } = useOpenInContext();
return (
{providers.t3.icon}
{providers.t3.title}
);
};
export type OpenInSciraProps = ComponentProps;
export const OpenInScira = (props: OpenInSciraProps) => {
const { query } = useOpenInContext();
return (
{providers.scira.icon}
{providers.scira.title}
);
};
export type OpenInv0Props = ComponentProps;
export const OpenInv0 = (props: OpenInv0Props) => {
const { query } = useOpenInContext();
return (
{providers.v0.icon}
{providers.v0.title}
);
};
export type OpenInCursorProps = ComponentProps;
export const OpenInCursor = (props: OpenInCursorProps) => {
const { query } = useOpenInContext();
return (
{providers.cursor.icon}
{providers.cursor.title}
);
};