FlowAuth: show Renew button on expired tokens#7282
Conversation
The renewal endpoint already accepts expired tokens (it only checks the server/role expiry caps, not the original token's `expires`), but the React UI hid the button on rows whose expiry had passed and never passed `onRenew` to tokens rendered under the Expired tokens section. Drop the `!isExpired` guard in `Token.jsx` and wire up `onRenew` on the `expiredTokens.map` iteration in `TokenList.jsx`. Service-account use case: an Airflow `flowbot` token whose JWT has already expired can now be renewed in-place by clicking Renew on the Expired tokens list, without first re-minting from scratch.
WalkthroughThe pull request modifies the FlowAuth token UI to display the "Renew" button for expired tokens, extending access to renewal functionality that the backend already supported. Changes span the changelog, Token component conditional rendering, and TokenList callback provision across both active and expired token sections. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~8 minutes Possibly related issues
Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
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. Review rate limit: 0/1 reviews remaining, refill in 60 minutes.Comment |
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
flowauth/frontend/src/TokenList.jsx (1)
107-118:⚠️ Potential issue | 🟠 MajorAdd stable
keyprops for token rows to prevent row state leaking after renew/reorder.
Tokenis stateful, and rendering list items without keys can cause React to re-use row state on the wrong token when items move between expired/active lists after renewal.Suggested fix
{activeTokens.map((object) => ( <Token + key={object.id} id={object.id} name={object.name} expiry={object.expires} token={object.token} roles={object.roles} classes={classes} editAction={editAction} onRenew={this.handleRenew} /> ))} ... {expiredTokens.map((object) => ( <Token + key={object.id} id={object.id} name={object.name} expiry={object.expires} token={object.token} roles={object.roles} classes={classes} editAction={editAction} onRenew={this.handleRenew} /> ))}Also applies to: 138-149
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@flowauth/frontend/src/TokenList.jsx` around lines 107 - 118, The mapped Token components lack stable React keys, causing state to follow the wrong row when lists reorder (e.g., on renew); update the JSX that maps activeTokens to include a key prop using a stable unique id (use object.id) on the Token element, and make the same change in the other Token mapping block that renders expired tokens so each Token has key={object.id} (or another stable unique field) to prevent state leaking between rows.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Outside diff comments:
In `@flowauth/frontend/src/TokenList.jsx`:
- Around line 107-118: The mapped Token components lack stable React keys,
causing state to follow the wrong row when lists reorder (e.g., on renew);
update the JSX that maps activeTokens to include a key prop using a stable
unique id (use object.id) on the Token element, and make the same change in the
other Token mapping block that renders expired tokens so each Token has
key={object.id} (or another stable unique field) to prevent state leaking
between rows.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: e6383e67-3d6e-45e5-a2b5-22c9ef47d6e3
📒 Files selected for processing (3)
CHANGELOG.mdflowauth/frontend/src/Token.jsxflowauth/frontend/src/TokenList.jsx
FlowAuth
|
||||||||||||||||||||||||||||
| Project |
FlowAuth
|
| Branch Review |
flowauth/renew-expired-tokens
|
| Run status |
|
| Run duration | 00m 43s |
| Commit |
|
| Committer | Joachim Jellinek |
| View all properties for this run ↗︎ | |
| Test results | |
|---|---|
|
|
0
|
|
|
0
|
|
|
0
|
|
|
0
|
|
|
4
|
| View all changes introduced in this branch ↗︎ | |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #7282 +/- ##
==========================================
- Coverage 92.02% 91.19% -0.83%
==========================================
Files 279 279
Lines 10878 10878
Branches 697 697
==========================================
- Hits 10010 9920 -90
- Misses 716 804 +88
- Partials 152 154 +2 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
Summary
expires. But the UI was hiding the button on any row whoseexpiryhad passed, so there was no way to actually trigger it.!isExpiredguard inToken.jsxand passonRenew={this.handleRenew}on theexpiredTokens.mapiteration inTokenList.jsx. Three lines.This unblocks the service-account use case (e.g. Airflow's
flowbottoken): when the JWT has already expired, the operator can renew it in place from the Expired tokens list rather than re-minting from scratch and rewiring consumers.Test plan
expiryin the past: open the token list, confirm the "Renew" button now appears in the Expired tokens section.Summary by CodeRabbit
Release Notes