From dcdb178468bd5c0db55e157d1513aea94dd0d30d Mon Sep 17 00:00:00 2001
From: Mohamed Boudra <boudra.moha@gmail.com>
Date: Tue, 9 Jun 2026 14:03:20 +0700
Subject: [PATCH] Add OMP (Oh My Pi) icon and landing page

---
 .../app/src/components/icons/omp-icon.tsx     | 14 +++++++++++++
 packages/app/src/components/provider-icons.ts |  3 ++-
 .../website/src/components/landing-page.tsx   | 19 ++++++++++++++++-
 packages/website/src/data/agent-pages.ts      | 10 +++++++++
 packages/website/src/routeTree.gen.ts         | 21 +++++++++++++++++++
 packages/website/src/routes/omp.tsx           |  4 ++++
 6 files changed, 69 insertions(+), 2 deletions(-)
 create mode 100644 packages/app/src/components/icons/omp-icon.tsx
 create mode 100644 packages/website/src/routes/omp.tsx

diff --git a/packages/app/src/components/icons/omp-icon.tsx b/packages/app/src/components/icons/omp-icon.tsx
new file mode 100644
index 000000000..880defe77
--- /dev/null
+++ b/packages/app/src/components/icons/omp-icon.tsx
@@ -0,0 +1,14 @@
+import Svg, { Path } from "react-native-svg";
+
+interface OmpIconProps {
+  size?: number;
+  color?: string;
+}
+
+export function OmpIcon({ size = 16, color = "currentColor" }: OmpIconProps) {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 64 64" fill={color}>
+      <Path d="M10 14h44v9H43v33h-9V23h-9v22h-9V23H10z" fill={color} />
+    </Svg>
+  );
+}
diff --git a/packages/app/src/components/provider-icons.ts b/packages/app/src/components/provider-icons.ts
index 941c56d7d..d552537e5 100644
--- a/packages/app/src/components/provider-icons.ts
+++ b/packages/app/src/components/provider-icons.ts
@@ -5,6 +5,7 @@ import { ClaudeIcon } from "@/components/icons/claude-icon";
 import { CodexIcon } from "@/components/icons/codex-icon";
 import { CopilotIcon } from "@/components/icons/copilot-icon";
 import { OpenCodeIcon } from "@/components/icons/opencode-icon";
+import { OmpIcon } from "@/components/icons/omp-icon";
 import { PiIcon } from "@/components/icons/pi-icon";
 import { ACP_PROVIDER_CATALOG } from "@/data/acp-provider-catalog";
 import {
@@ -24,7 +25,7 @@ const BUILTIN_PROVIDER_ICONS: Record<BuiltinProviderIconName, ProviderIconCompon
   codex: CodexIcon as unknown as ProviderIconComponent,
   copilot: CopilotIcon as unknown as ProviderIconComponent,
   kiro: PackagePlus,
-  omp: PiIcon as unknown as ProviderIconComponent,
+  omp: OmpIcon as unknown as ProviderIconComponent,
   opencode: OpenCodeIcon as unknown as ProviderIconComponent,
   pi: PiIcon as unknown as ProviderIconComponent,
 };
diff --git a/packages/website/src/components/landing-page.tsx b/packages/website/src/components/landing-page.tsx
index 1db7716da..9d92e5380 100644
--- a/packages/website/src/components/landing-page.tsx
+++ b/packages/website/src/components/landing-page.tsx
@@ -127,9 +127,10 @@ const CLAUDE_CODE_BADGE_ICON = <ClaudeCodeIcon className="h-6 w-6" />;
 const CODEX_BADGE_ICON = <CodexIcon className="h-6 w-6" />;
 const OPENCODE_BADGE_ICON = <OpenCodeIcon className="h-6 w-6" />;
 const COPILOT_BADGE_ICON = <CopilotIcon className="h-6 w-6" />;
+const OMP_BADGE_ICON = <OmpIcon className="h-6 w-6" />;
 const PI_BADGE_ICON = <PiIcon className="h-6 w-6" />;
 
-const FEATURED_AGENT_COUNT = 5;
+const FEATURED_AGENT_COUNT = 6;
 const ADDITIONAL_AGENT_COUNT = AGENT_PAGES.length - FEATURED_AGENT_COUNT;
 
 const SOCIAL_PROOF_TWEETS = [
@@ -358,6 +359,7 @@ function MultiProviderSection() {
     { name: "Codex", icon: <CodexIcon className="w-7 h-7" /> },
     { name: "OpenCode", icon: <OpenCodeIcon className="w-7 h-7" /> },
     { name: "Copilot", icon: <CopilotIcon className="w-7 h-7" /> },
+    { name: "OMP (Oh My Pi)", icon: <OmpIcon className="w-7 h-7" /> },
     { name: "Pi", icon: <PiIcon className="w-7 h-7" /> },
   ];
 
@@ -1251,6 +1253,7 @@ function GetStarted() {
           <AgentBadge name="Codex" icon={CODEX_BADGE_ICON} />
           <AgentBadge name="OpenCode" icon={OPENCODE_BADGE_ICON} />
           <AgentBadge name="Copilot" icon={COPILOT_BADGE_ICON} />
+          <AgentBadge name="OMP (Oh My Pi)" icon={OMP_BADGE_ICON} />
           <AgentBadge name="Pi" icon={PI_BADGE_ICON} />
         </div>
         <a
@@ -1375,6 +1378,20 @@ function CopilotIcon(props: React.SVGProps<SVGSVGElement>) {
   );
 }
 
+function OmpIcon(props: React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 64 64"
+      fill="currentColor"
+      aria-hidden="true"
+      {...props}
+    >
+      <path d="M10 14h44v9H43v33h-9V23h-9v22h-9V23H10z" />
+    </svg>
+  );
+}
+
 function PiIcon(props: React.SVGProps<SVGSVGElement>) {
   return (
     <svg
diff --git a/packages/website/src/data/agent-pages.ts b/packages/website/src/data/agent-pages.ts
index fb5192c26..310b26147 100644
--- a/packages/website/src/data/agent-pages.ts
+++ b/packages/website/src/data/agent-pages.ts
@@ -52,6 +52,16 @@ export const AGENT_PAGES = [
     metaDescription:
       "Open source mobile and desktop app for GitHub Copilot. Launch sessions on your machine, monitor progress, merge from anywhere.",
   },
+  {
+    slug: "omp",
+    name: "OMP (Oh My Pi)",
+    title: "Open source app for OMP (Oh My Pi)",
+    subtitle:
+      "Run OMP (Oh My Pi) on your machine, drive it from your phone or desktop. Self-hosted and open source.",
+    metaTitle: "OMP (Oh My Pi) Mobile and Desktop App, Open Source",
+    metaDescription:
+      "Open source mobile and desktop app for OMP (Oh My Pi). Launch sessions on your machine, monitor progress, merge from anywhere. Self-hosted.",
+  },
   {
     slug: "pi",
     name: "Pi Agent",
diff --git a/packages/website/src/routeTree.gen.ts b/packages/website/src/routeTree.gen.ts
index ff412c0bd..2204c494a 100644
--- a/packages/website/src/routeTree.gen.ts
+++ b/packages/website/src/routeTree.gen.ts
@@ -19,6 +19,7 @@ import { Route as PrivacyRouteImport } from "./routes/privacy";
 import { Route as PoolsideRouteImport } from "./routes/poolside";
 import { Route as PiRouteImport } from "./routes/pi";
 import { Route as OpencodeRouteImport } from "./routes/opencode";
+import { Route as OmpRouteImport } from "./routes/omp";
 import { Route as NovaRouteImport } from "./routes/nova";
 import { Route as MistralVibeRouteImport } from "./routes/mistral-vibe";
 import { Route as MinionCodeRouteImport } from "./routes/minion-code";
@@ -111,6 +112,11 @@ const OpencodeRoute = OpencodeRouteImport.update({
   path: "/opencode",
   getParentRoute: () => rootRouteImport,
 } as any);
+const OmpRoute = OmpRouteImport.update({
+  id: "/omp",
+  path: "/omp",
+  getParentRoute: () => rootRouteImport,
+} as any);
 const NovaRoute = NovaRouteImport.update({
   id: "/nova",
   path: "/nova",
@@ -355,6 +361,7 @@ export interface FileRoutesByFullPath {
   "/minion-code": typeof MinionCodeRoute;
   "/mistral-vibe": typeof MistralVibeRoute;
   "/nova": typeof NovaRoute;
+  "/omp": typeof OmpRoute;
   "/opencode": typeof OpencodeRoute;
   "/pi": typeof PiRoute;
   "/poolside": typeof PoolsideRoute;
@@ -406,6 +413,7 @@ export interface FileRoutesByTo {
   "/minion-code": typeof MinionCodeRoute;
   "/mistral-vibe": typeof MistralVibeRoute;
   "/nova": typeof NovaRoute;
+  "/omp": typeof OmpRoute;
   "/opencode": typeof OpencodeRoute;
   "/pi": typeof PiRoute;
   "/poolside": typeof PoolsideRoute;
@@ -460,6 +468,7 @@ export interface FileRoutesById {
   "/minion-code": typeof MinionCodeRoute;
   "/mistral-vibe": typeof MistralVibeRoute;
   "/nova": typeof NovaRoute;
+  "/omp": typeof OmpRoute;
   "/opencode": typeof OpencodeRoute;
   "/pi": typeof PiRoute;
   "/poolside": typeof PoolsideRoute;
@@ -515,6 +524,7 @@ export interface FileRouteTypes {
     | "/minion-code"
     | "/mistral-vibe"
     | "/nova"
+    | "/omp"
     | "/opencode"
     | "/pi"
     | "/poolside"
@@ -566,6 +576,7 @@ export interface FileRouteTypes {
     | "/minion-code"
     | "/mistral-vibe"
     | "/nova"
+    | "/omp"
     | "/opencode"
     | "/pi"
     | "/poolside"
@@ -619,6 +630,7 @@ export interface FileRouteTypes {
     | "/minion-code"
     | "/mistral-vibe"
     | "/nova"
+    | "/omp"
     | "/opencode"
     | "/pi"
     | "/poolside"
@@ -673,6 +685,7 @@ export interface RootRouteChildren {
   MinionCodeRoute: typeof MinionCodeRoute;
   MistralVibeRoute: typeof MistralVibeRoute;
   NovaRoute: typeof NovaRoute;
+  OmpRoute: typeof OmpRoute;
   OpencodeRoute: typeof OpencodeRoute;
   PiRoute: typeof PiRoute;
   PoolsideRoute: typeof PoolsideRoute;
@@ -757,6 +770,13 @@ declare module "@tanstack/react-router" {
       preLoaderRoute: typeof OpencodeRouteImport;
       parentRoute: typeof rootRouteImport;
     };
+    "/omp": {
+      id: "/omp";
+      path: "/omp";
+      fullPath: "/omp";
+      preLoaderRoute: typeof OmpRouteImport;
+      parentRoute: typeof rootRouteImport;
+    };
     "/nova": {
       id: "/nova";
       path: "/nova";
@@ -1109,6 +1129,7 @@ const rootRouteChildren: RootRouteChildren = {
   MinionCodeRoute: MinionCodeRoute,
   MistralVibeRoute: MistralVibeRoute,
   NovaRoute: NovaRoute,
+  OmpRoute: OmpRoute,
   OpencodeRoute: OpencodeRoute,
   PiRoute: PiRoute,
   PoolsideRoute: PoolsideRoute,
diff --git a/packages/website/src/routes/omp.tsx b/packages/website/src/routes/omp.tsx
new file mode 100644
index 000000000..9d755c173
--- /dev/null
+++ b/packages/website/src/routes/omp.tsx
@@ -0,0 +1,4 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { agentRouteOptions } from "~/components/agent-route";
+
+export const Route = createFileRoute("/omp")(agentRouteOptions("omp"));