pipecd: Add applications list by harshitghagre · Pull Request #1301 · headlamp-k8s/plugins

harshitghagre · 2026-09-17T05:50:50Z

This PR adds the Applications page for the PipeCD plugin.

It lists PipeCD applications with their platform, sync status, last sync time and repository. Users can search by name or repo, and filter by platform. Each row links to the application in PipeCD.

Depends on #1300 .

Part of the LFX Mentorship 2026 Term 3, tracked in pipe-cd/pipecd#6706.

Screenshot

illume

Thanks for these changes.

Can you please have a look at the git commits to see if they meet the contribution guidelines? We use a Linux kernel style of git commits. See the contributing guide for general context, and please see previous git commits with git log for examples.

Commits that need attention

pipecd: add initial plugin project structure — Description must start with a capital letter — e.g. frontend: HomeButton: Fix the button not frontend: HomeButton: fix the button.
pipecd: trim README to a placeholder — Description must start with a capital letter — e.g. frontend: HomeButton: Fix the button not frontend: HomeButton: fix the button.
pipecd: add Apache license header — Description must start with a capital letter — e.g. frontend: HomeButton: Fix the button not frontend: HomeButton: fix the button.
pipecd: add API client and settings page — Description must start with a capital letter — e.g. frontend: HomeButton: Fix the button not frontend: HomeButton: fix the button.
pipecd: add applications list — Description must start with a capital letter — e.g. frontend: HomeButton: Fix the button not frontend: HomeButton: fix the button.

Commit guidelines

Use atomic commits focused on a single change.
Use the title format <area>: <Description of changes> — description must start with a capital letter.
Keep the title under 72 characters (soft requirement).
Explain the intention and why the change is needed.
Make commit titles meaningful and describe what changed.
Do not add code that a later commit rewrites; squash or reorder commits instead.
Do not include Fixes #NN in commit messages.

Good examples:

frontend: HomeButton: Fix so it navigates to home
backend: config: Add enable-dynamic-clusters flag

Copilot

Copilot review overview

🟡 Changes recommended

Cloud Run filtering is broken, request cancellation is ineffective, and connection security and setup documentation need correction.

Review effort: Balanced
Findings: 1 · 3 · 1

Open (5)

Require HTTPS endpoints except for explicit loopback development use · New
Forward request signals and handle cancellation safely · New
Translate Cloud Run filter value to the protobuf enum · New
Forward the cancellation signal in listDeployments · New
Document gRPC-Web, CORS, server URL, and API key prerequisites · New

What changed in this PR

Adds the PipeCD plugin’s application listing, API integration, settings, navigation, generated protobuf bindings, and tests.

Changes:

Adds searchable, platform-filtered application status table.
Adds PipeCD gRPC-Web client and connection settings.
Registers plugin routes and includes supporting tests and generated models.

File	Description
`pipecd/tsconfig.json`	Configures TypeScript.
`pipecd/src/types/pipecd.ts`	Defines domain types.
`pipecd/src/index.tsx`	Registers navigation and routes.
`pipecd/src/images.d.ts`	Declares PNG imports.
`pipecd/src/headlamp-plugin.d.ts`	Declares plugin asset types.
`pipecd/src/generated/pkg/model/user_pb.ts`	Adds generated user bindings.
`pipecd/src/generated/pkg/model/role_pb.ts`	Adds generated role bindings.
`pipecd/src/generated/pkg/model/rbac_pb.ts`	Adds generated RBAC bindings.
`pipecd/src/generated/pkg/model/project_pb.ts`	Adds generated project bindings.
`pipecd/src/generated/pkg/model/planpreview_pb.ts`	Adds generated plan-preview bindings.
`pipecd/src/generated/pkg/model/piped_stat_pb.ts`	Adds generated Piped-stat bindings.
`pipecd/src/generated/pkg/model/piped_pb.ts`	Adds generated Piped bindings.
`pipecd/src/generated/pkg/model/logblock_pb.ts`	Adds generated log bindings.
`pipecd/src/generated/pkg/model/insight_pb.ts`	Adds generated insight bindings.
`pipecd/src/generated/pkg/model/event_pb.ts`	Adds generated event bindings.
`pipecd/src/generated/pkg/model/deployment_trace_pb.ts`	Adds generated trace bindings.
`pipecd/src/generated/pkg/model/deployment_pb.ts`	Adds generated deployment bindings.
`pipecd/src/generated/pkg/model/deployment_chain_pb.ts`	Adds generated chain bindings.
`pipecd/src/generated/pkg/model/common_pb.ts`	Adds shared generated models.
`pipecd/src/generated/pkg/model/command_pb.ts`	Adds generated command bindings.
`pipecd/src/generated/pkg/model/application_pb.ts`	Adds generated application bindings.
`pipecd/src/generated/pkg/model/apikey_pb.ts`	Adds generated API-key bindings.
`pipecd/src/generated/pkg/model/analysis_result_pb.ts`	Adds generated analysis bindings.
`pipecd/src/components/SyncStatusLabel.tsx`	Renders sync status labels.
`pipecd/src/components/SettingsPage.tsx`	Adds connection settings UI.
`pipecd/src/components/NotConfigured.tsx`	Adds configuration prompt.
`pipecd/src/components/KindBadge.tsx`	Renders platform badges.
`pipecd/src/components/ApplicationList.tsx`	Implements the applications page.
`pipecd/src/api/pipecd.ts`	Implements API access and mapping.
`pipecd/src/__tests__/SyncStatusLabel.test.tsx`	Tests status labels.
`pipecd/src/__tests__/SettingsPage.test.tsx`	Tests settings behavior.
`pipecd/src/__tests__/pipecd-api.test.ts`	Tests API integration.
`pipecd/src/__tests__/fixtures.ts`	Provides test fixtures.
`pipecd/src/__tests__/ApplicationList.test.tsx`	Tests application listing.
`pipecd/README.md`	Adds plugin heading.
`pipecd/package.json`	Defines package and dependencies.
`pipecd/locales/en/translation.json`	Initializes English translations.
`pipecd/AGENTS.md`	Documents development guidance.
`pipecd/.prettierignore`	Excludes generated sources.
`pipecd/.gitignore`	Excludes generated artifacts.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Signed-off-by: harshitghagre <harshitghagre183@gmail.com>

harshitghagre · 2026-09-30T12:07:44Z

@illume fixed

Signed-off-by: harshitghagre <harshitghagre183@gmail.com>

Copilot

🟡 Changes recommended

Pagination, routing, and request-state races can hide applications or lead users to broken or stale views.

8 open findings

Application links navigate to an unregistered detail route · New
Configure link omits cluster route prefix · New
Application list ignores pagination cursor · New
Aborted request can incorrectly clear loading state · New
Refresh response can overwrite newer filtered results · New
Editing URL can leave connection testing permanently active · New
README documents unavailable detail and log pages · New
Search field lacks an accessible label · New

5 resolved since last review

🧠 Review effort: Balanced

illume

Thanks for the contribution.

There are some open Copilot review comments — could you take a look at them? Please mark each one as resolved once you've addressed it.

Signed-off-by: harshitghagre <harshitghagre183@gmail.com>

harshitghagre · 2026-10-11T11:42:02Z

@illume requested changes were fixed,
PATL

Copilot

🟡 Changes recommended

Platform filtering is incorrect for plugin-architecture applications, with additional URL, localization, and accessibility issues remaining.

5 open findings

8 resolved since last review

🧠 Review effort: Balanced

illume

Thanks for the contribution.

There are some open Copilot review comments — could you take a look at them? Please mark each one as resolved once you've addressed it.

Signed-off-by: harshitghagre <harshitghagre183@gmail.com>

harshitghagre · 2026-10-12T09:27:03Z

@illume Requested changes were fixed, please note

pipecd: Add applications list #1301 (comment) fixed in pipecd: Add API client and settings page #1300
pipecd: Add applications list #1301 (comment) fixed in pipecd: Add initial plugin project structure #1277

Copilot

🔵 Needs a closer look

Unbounded API fetching and incorrect platform and relative-time handling can produce scalability and accuracy problems.

0 open findings

5 resolved since last review

Previously missed (5)

In code that hasn't changed since last review

Custom plugin deployments are misclassified as Kubernetes

pipecd/src/api/pipecd.ts:173

The fallback contradicts the function's own “only when there are none” contract. If deployTargetsByPlugin contains a custom or newly introduced plugin, no entry matches PLUGIN_KINDS, so the deprecated zero-valued a.kind makes that application appear as Kubernetes instead of Unknown. Only consult a.kind when the deploy-target map is empty.

Deployment mapping mislabels plugin-based deployment platforms

pipecd/src/api/pipecd.ts:273

Deployment mapping still reads the deprecated kind field, although plugin-architecture deployments expose their platform through deployTargetsByPlugin just like applications. Since the deprecated enum defaults to Kubernetes, Terraform, Lambda, Cloud Run, and ECS deployments can all be mislabeled. Resolve the recognized plugin name before falling back to the legacy enum.

Default page size allows unbounded application queries

pipecd/src/api/pipecd.ts:320

0 is not a bounded/default page size in PipeCD: the server forwards it to the datastore, whose MySQL and Firestore implementations only apply a limit when it is greater than zero. Consequently, the default call scans and serializes every application in the project at once, bypassing the cursor loop and creating an unbounded request for large projects. Use the API's documented page size so callers paginate predictably.

Dismissing load error incorrectly shows empty state

pipecd/src/components/ApplicationList.tsx:255

Clearing the load error makes an initial failed request immediately satisfy the empty-state condition below, so dismissing the alert falsely tells the user that PipeCD returned no applications. Keep the failure state distinct from alert visibility (or leave this initial error non-dismissible) so a network/API failure cannot become a successful empty result.

Relative sync time does not update while page remains open

pipecd/src/components/ApplicationList.tsx:327

This relative value is calculated only when React happens to render; there is no timer or clock state in this component. A row that says “just now” can therefore remain that way indefinitely while the page is open, making the Last Synced column inaccurate. Either schedule periodic rerenders or display the stable absolute timestamp here.

🧠 Review effort: Balanced

Copilot

🟡 Changes recommended

Application status, last-sync timestamps, and unknown-platform classification can display misleading information.

3 open findings

🧠 Review effort: Balanced

+  for (const plugin of Object.keys(a.deployTargetsByPlugin ?? {})) {
+    const kind = PLUGIN_KINDS[plugin.toLowerCase()];
+    if (kind) return kind;
+  }
+  return KIND_MAP[a.kind] ?? 'UNKNOWN';


+    syncState: a.syncState
+      ? {
+          status: SYNC_STATUS_MAP[a.syncState.status] ?? 'UNKNOWN',
+          shortReason: a.syncState.shortReason,
+          reason: a.syncState.reason,
+          timestamp: toNumber(a.syncState.timestamp),
+        }
+      : undefined,


+/**
+ * When an application was last synced.
+ *
+ * The sync state carries the reliable timestamp, and it is what the detail page
+ * shows. PipeCD often omits completedAt on the deployment reference, so the
+ * deployment timestamps are only a fallback.
+ */
+function lastSyncedAt(app: Application): number | undefined {
+  return (
+    app.syncState?.timestamp ||
+    app.mostRecentSuccessfulDeployment?.completedAt ||
+    app.mostRecentSuccessfulDeployment?.startedAt
+  );
+}


illume

Thanks for this PR.

There are git conflicts in this PR that need to be resolved.

How to resolve conflicts

Rebase or merge the latest main into your branch, resolve the conflicts, and push the updated branch.

The open review comments from Copilot still need attention — can you have a look? Once addressed, please mark them as resolved.

harshitghagre requested review from ashu8912, illume, joaquimrocha, skoeva, sniok, vyncent-t and yolossn as code owners September 17, 2026 05:50

harshitghagre mentioned this pull request Sep 17, 2026

feat(proposal): Headlamp Plugin for PipeCD pipe-cd/pipecd#6706

Open

illume requested a balanced review from Copilot September 29, 2026 06:31

illume requested changes Sep 29, 2026

View reviewed changes

Copilot started reviewing on behalf of illume September 29, 2026 06:32

View session

Copilot AI reviewed Sep 29, 2026

View reviewed changes

Comment thread pipecd/src/components/SettingsPage.tsx Outdated

Comment thread pipecd/src/api/pipecd.ts Outdated

Comment thread pipecd/src/api/pipecd.ts Outdated

Comment thread pipecd/src/api/pipecd.ts Outdated

Comment thread pipecd/README.md Outdated

pipecd: Add plugin scaffold

8a5d28e

Signed-off-by: harshitghagre <harshitghagre183@gmail.com>

harshitghagre changed the title ~~pipecd: add applications list~~ pipecd: dd applications list Sep 30, 2026

harshitghagre changed the title ~~pipecd: dd applications list~~ pipecd: Add applications list Sep 30, 2026

pipecd: Add PipeCD API client and settings page

cd7ad9e

Signed-off-by: harshitghagre <harshitghagre183@gmail.com>

harshitghagre force-pushed the pipecd-applications-list branch from 7341f98 to d5eb85b Compare September 30, 2026 12:06

harshitghagre requested a review from illume September 30, 2026 12:07

pipecd: Fixed state issues on the API client and settings page

715cc1a

Signed-off-by: harshitghagre <harshitghagre183@gmail.com>

illume requested a balanced review from Copilot October 11, 2026 05:22

Copilot started reviewing on behalf of illume October 11, 2026 05:23

View session

Copilot AI reviewed Oct 11, 2026

View reviewed changes

illume requested changes Oct 11, 2026

View reviewed changes

pipecd: applications: Add the applications list page

9154085

Signed-off-by: harshitghagre <harshitghagre183@gmail.com>

harshitghagre force-pushed the pipecd-applications-list branch from d5eb85b to 9154085 Compare October 11, 2026 11:32

illume added enhancement New feature or request pipecd labels Oct 11, 2026

illume requested a balanced review from Copilot October 11, 2026 14:36

Copilot started reviewing on behalf of illume October 11, 2026 14:37

View session

Copilot AI reviewed Oct 11, 2026

View reviewed changes

Comment thread pipecd/src/components/ApplicationList.tsx

Comment thread pipecd/src/components/KindBadge.tsx Outdated

Comment thread pipecd/src/components/SettingsPage.tsx

Comment thread pipecd/AGENTS.md

Comment thread pipecd/locales/en/translation.json Outdated

illume requested changes Oct 12, 2026

View reviewed changes

pipecd: applications: Fix platform filter, badge contrast and i18n

53e44c0

Signed-off-by: harshitghagre <harshitghagre183@gmail.com>

illume requested a balanced review from Copilot October 12, 2026 12:58

Copilot started reviewing on behalf of illume October 12, 2026 12:59

View session

Copilot AI reviewed Oct 12, 2026

View reviewed changes

illume requested a balanced review from Copilot October 15, 2026 07:39

Copilot AI reviewed Oct 15, 2026

View reviewed changes

Copilot started reviewing on behalf of illume October 15, 2026 07:46

View session

illume requested changes Oct 15, 2026

View reviewed changes

Conversation

harshitghagre commented Sep 17, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Screenshot

Uh oh!

illume left a comment

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Copilot review overview

🟡 Changes recommended

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

harshitghagre commented Sep 30, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

🟡 Changes recommended

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

illume left a comment

Choose a reason for hiding this comment

Uh oh!

harshitghagre commented Oct 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

🟡 Changes recommended

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

illume left a comment

Choose a reason for hiding this comment

Uh oh!

harshitghagre commented Oct 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

🔵 Needs a closer look

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

🟡 Changes recommended

Uh oh!

illume left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

harshitghagre commented Sep 17, 2026 •

edited

Loading

harshitghagre commented Oct 11, 2026 •

edited

Loading

harshitghagre commented Oct 12, 2026 •

edited

Loading