Skip to content

feat: Add approved version check for API Management button on iOS/Android #420

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
AnthonyRonning merged 3 commits into from
Feb 10, 2026
Merged

feat: Add approved version check for API Management button on iOS/Android #420

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
ca5a68e
feat: Add approved version check for API Management button on iOS/And…
github-actions[bot] Feb 9, 2026
7cfbe05
Fix query key to prevent cache poisoning between AccountMenu and pric…
github-actions[bot] Feb 9, 2026
9449a88
Fix Android gating for API Management button
github-actions[bot] Feb 10, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 40 additions & 2 deletions frontend/src/components/AccountMenu.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import {
FileText,
ChevronLeft
} from "lucide-react";
import { isMobile, isTauri } from "@/utils/platform";
import { isMobile, isTauri, isIOS } from "@/utils/platform";

import { Button } from "@/components/ui/button";
import {
Expand Down Expand Up @@ -51,6 +51,7 @@ import { useState } from "react";
import type { TeamStatus } from "@/types/team";
import { TeamManagementDialog } from "@/components/team/TeamManagementDialog";
import { ApiKeyManagementDialog } from "@/components/apikeys/ApiKeyManagementDialog";
import packageJson from "../../package.json";

@coderabbitai coderabbitai Bot Feb 9, 2026

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Replace the relative package.json import with an alias-based source.
The new relative import breaks the repo rule for TS/TSX imports and pulls from outside src. Consider exposing the version via a src module (or build-time env) and import it via @/….

♻️ Suggested update 
-import packageJson from "../../package.json";
+import { appVersion } from "@/config/appVersion";

You can back this with a small module like frontend/src/config/appVersion.ts that reads from a build-time env or a generated constant.
As per coding guidelines, "Use path aliases (@/* maps to ./src/*) for imports in TypeScript/React files".

🤖 Prompt for AI Agents 
In `@frontend/src/components/AccountMenu.tsx` at line 54, Replace the relative
import of package.json in AccountMenu.tsx with an alias-based module: create a
small module (e.g., export const appVersion in src/config/appVersion.ts) that
exposes the version from a build-time env or generated constant, then update
AccountMenu.tsx to import the version via the path alias (e.g., import {
appVersion } from '@/config/appVersion'); ensure no direct ../../package.json
imports remain and the new module is used wherever version is needed.


function ConfirmDeleteDialog() {
const { clearHistory } = useLocalState();
Expand Down Expand Up @@ -129,10 +130,47 @@ export function AccountMenu() {
enabled: isTeamPlan && !!os.auth.user && !!billingStatus
});

// Fetch products with version check for iOS to determine API Management availability
const isIOSPlatform = isIOS();
const { data: products } = useQuery({
queryKey: ["products-version-check", isIOSPlatform],
queryFn: async () => {
try {
const billingService = getBillingService();
// Send version for iOS builds (App Store restrictions)
if (isIOSPlatform) {
const version = `v${packageJson.version}`;
return await billingService.getProducts(version);
}
return await billingService.getProducts();
} catch (error) {
console.error("Error fetching products for version check:", error);
return null;
}
Comment thread
AnthonyRonning marked this conversation as resolved.
},
enabled: isIOSPlatform
});
Comment thread
AnthonyRonning marked this conversation as resolved.

// Show alert badge if user has team plan but hasn't created team yet
Comment thread
AnthonyRonning marked this conversation as resolved.
const showTeamSetupAlert =
isTeamPlan && teamStatus?.has_team_subscription && !teamStatus?.team_created;

// Determine if API Management should be shown
// On desktop/web/Android: always show
// On iOS only: only show if version is approved (at least one product is available)
const showApiManagement = (() => {
if (!isIOSPlatform) {
return true; // Always show on desktop/web/Android
}
// On iOS, check if version is approved
// If products is null/undefined, default to false (hide until we know)
if (!products) {
return false;
}
// Show if at least one product is available (meaning version is approved)
return products.some((product) => product.is_available !== false);
})();
Comment thread
AnthonyRonning marked this conversation as resolved.
Comment thread
AnthonyRonning marked this conversation as resolved.

const handleManageSubscription = async () => {
if (!hasStripeAccount) return;

Expand Down Expand Up @@ -300,7 +338,7 @@ export function AccountMenu() {
</div>
</DropdownMenuItem>
)}
{!isMobile() && (
{showApiManagement && (
<DropdownMenuItem onClick={() => setIsApiKeyDialogOpen(true)}>
<Key className="mr-2 h-4 w-4" />
<span>API Management</span>
Expand Down
Loading