Feat: Organization & account keys #2728

Meldiron · 2025-12-22T17:04:01Z

What does this PR do?

Implements UI to manage more types of keys

Test Plan

Manual QA

Related PRs and Issues

appwrite/appwrite#10988

Have you read the Contributing Guidelines on issues?

Yes

Summary by CodeRabbit

Release Notes

New Features
- Added account integrations section with API key management.
- Added organization integrations section with key management (Applications and Installations coming soon).
- Extended key management system to support organization and account tokens in addition to API keys.
- Added keyboard shortcuts to navigate to integrations pages.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

appwrite · 2025-12-22T17:04:07Z

Console (appwrite/console)

Project ID: 688b7bf400350cbd60e9

Sites (1)

Site	Status	Logs	Preview	QR
console-stage `688b7cf6003b1842c9dc`	Ready	View Logs	Preview URL

Tip

Global CDN and DDoS protection come free with every Sites deployment

coderabbitai · 2025-12-22T17:04:16Z

Walkthrough

This PR extends the application to support organizational and account-level API keys alongside existing API keys. Changes include: updating the scopes data structure with a new type field ('api' | 'organization' | 'account') and adding corresponding scope entries; creating new routes and pages for account and organization integrations; refactoring key management components (create, delete, table) to handle multiple key types; updating navigation headers with integrations tabs; and modifying the scopes component to filter based on key type. The dependency @appwrite.io/console is also updated to a newer artifact version.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~50 minutes

Scopes data structure expansion: Review the new type field additions across scopes and cloudOnlyBackupScopes entries to ensure all entries are correctly classified and no values are missing.
create.svelte refactoring: Verify the type-specific key creation flows (createProjectKey, createOrganizationKey, createAccountKey) properly delegate to correct SDK methods, handle invalidation correctly, and navigate to appropriate routes for each type.
table.svelte helper functions: Check that the new derived helper functions (canWrite, getLabel, getSlug, getColumns, etc.) correctly map behavior for all four key types and that conditional rendering (scopes, create button) uses correct predicates.
deleteBatch.svelte deletion logic: Ensure deleteKey properly routes to the correct SDK endpoint for each key type and that postDeleteRedirect behaves correctly (API keys navigate; others are no-ops).
scopes.svelte filtering: Verify the new type-based filtering pipeline correctly filters scope entries and that category computation dynamically derives from filtered scopes.
Route consistency: Confirm that new routes (account/integrations, organization/integrations) properly load and pass data, and that navigation commands/tabs correctly enable/disable based on conditions.
SDK integration: Verify all new SDK calls (sdk.forConsole.account.listKeys, sdk.forConsole.organizations.listKeys) are correctly invoked with proper parameters.

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'Feat: Organization & account keys' accurately captures the main feature being implemented—support for managing organization and account key types alongside existing API keys.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch feat-platform-keys

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

coderabbitai

Actionable comments posted: 2

🧹 Nitpick comments (5)

src/routes/(console)/account/integrations/create-token/+page.svelte (1)
1-5: Use $routes alias instead of deep relative path.

The import uses a fragile 3-level relative path. As per coding guidelines, prefer $routes alias for route module imports.
Suggested fix
 <script lang="ts">
-    import CreateKey from '../../../project-[region]-[project]/overview/(components)/create.svelte';
+    import CreateKey from '$routes/(console)/project-[region]-[project]/overview/(components)/create.svelte';
 </script>
src/routes/(console)/account/integrations/+page.svelte (1)
1-11: Consider migrating to Svelte 5 runes syntax.

The component uses Svelte 4's export let data pattern. Other files in this PR (e.g., header.svelte) use Svelte 5's $derived rune. Consider using Svelte 5 syntax for consistency.
Svelte 5 runes syntax
 <script lang="ts">
     import { Container } from '$lib/layout';
     import type { PageData } from './$types';
     import Keys from './keys.svelte';
 
-    export let data: PageData;
+    let { data }: { data: PageData } = $props();
 </script>
src/routes/(console)/organization-[organization]/integrations/create-key/+page.svelte (1)
2-2: Consider moving shared CreateKey component to $lib for better maintainability.

The relative import path traverses multiple directory levels to access a component from a different route section. This creates tight coupling and violates the coding guideline to use $lib alias instead of relative paths.
🔎 Recommended approach

Move the shared CreateKey component to $lib/components or a similar shared location, then import it using the $lib alias:
-    import CreateKey from '../../../project-[region]-[project]/overview/(components)/create.svelte';
+    import CreateKey from '$lib/components/createKey.svelte';
This improves maintainability and follows the project's convention of using path aliases.
Based on coding guidelines: Use $lib, $routes, and $themes aliases instead of relative paths for module imports.
src/routes/(console)/organization-[organization]/integrations/keys.svelte (1)

5-5: Consider moving shared Table component to $lib.

Similar to the CreateKey component, the Table component is imported using a relative path from a different route section. For consistency and maintainability, shared components should be placed in $lib and imported using the $lib alias.

Based on coding guidelines: Use $lib, $routes, and $themes aliases instead of relative paths for module imports.

src/routes/(console)/account/integrations/keys.svelte (1)

5-5: Consider moving shared Table component to $lib.

The Table component is imported using a relative path from a different route section. For consistency and maintainability, shared components should be placed in $lib and imported using the $lib alias.

Based on coding guidelines: Use $lib, $routes, and $themes aliases instead of relative paths for module imports.

📜 Review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 580e5bf and 87a473e.

⛔ Files ignored due to path filters (1)

pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (20)

package.json
src/lib/constants.ts
src/routes/(console)/account/header.svelte
src/routes/(console)/account/integrations/+page.svelte
src/routes/(console)/account/integrations/+page.ts
src/routes/(console)/account/integrations/create-token/+page.svelte
src/routes/(console)/account/integrations/keys.svelte
src/routes/(console)/organization-[organization]/+layout.svelte
src/routes/(console)/organization-[organization]/header.svelte
src/routes/(console)/organization-[organization]/integrations/+page.svelte
src/routes/(console)/organization-[organization]/integrations/+page.ts
src/routes/(console)/organization-[organization]/integrations/apps.svelte
src/routes/(console)/organization-[organization]/integrations/create-key/+page.svelte
src/routes/(console)/organization-[organization]/integrations/installations.svelte
src/routes/(console)/organization-[organization]/integrations/keys.svelte
src/routes/(console)/project-[region]-[project]/overview/(components)/create.svelte
src/routes/(console)/project-[region]-[project]/overview/(components)/deleteBatch.svelte
src/routes/(console)/project-[region]-[project]/overview/(components)/table.svelte
src/routes/(console)/project-[region]-[project]/overview/api-keys/scopes.svelte
src/routes/(console)/project-[region]-[project]/overview/store.ts

🧰 Additional context used

📓 Path-based instructions (6)

**/*.{ts,tsx,js,jsx,svelte}