Skip to content

feat(auth-files): priority display, sorting & credential notes#149

Open
RGBadmin wants to merge 2 commits intorouter-for-me:mainfrom
RGBadmin:feat/auth-priority-sort
Open

feat(auth-files): priority display, sorting & credential notes#149
RGBadmin wants to merge 2 commits intorouter-for-me:mainfrom
RGBadmin:feat/auth-priority-sort

Conversation

@RGBadmin
Copy link

概述 / Summary

为 Auth Files 凭证管理页面添加三项功能:优先级展示、排序支持、凭证备注。

Adds three features to the Auth Files credential management page: priority display, sorting support, and credential notes.

⚠️ 依赖后端改动 / Depends on backend change

本 PR 依赖后端 GET /auth-files 接口返回 prioritynote 字段。相关后端 PR 已提交:
CLIProxyAPI#2124

可以等后端 PR 合并后再合并本 PR。

This PR depends on the backend GET /auth-files endpoint returning priority and note fields. The corresponding backend PR has been submitted:
CLIProxyAPI#2124

This PR can be merged after the backend PR is merged.

功能详情 / Features

1. 优先级展示 / Priority display

  • 凭证卡片上显示 priority 值(badge 样式),与文件大小、修改时间并列
  • 无 priority 的凭证不显示 badge
  • Shows priority value as a badge on AuthFileCard alongside file size and modified time
  • Credentials without priority show no badge

2. 排序支持 / Sorting support

  • 筛选栏新增排序下拉框,支持三种模式:
    • 默认 — API 原始顺序 / Default — original API order
    • A-Z 名称 — 按文件名字母排序 / A-Z Name — alphabetical by name
    • 优先级 — 优先级从高到低(无 priority 默认为 0) / Priority — highest first (defaults to 0)

3. 凭证备注 / Credential notes

  • 凭证字段编辑弹窗新增 note 输入框
  • 备注保存在凭证 JSON 文件的 note 字段中
  • 卡片上展示备注(超长文本 2 行截断)
  • 空备注在保存时自动从 JSON 中移除
  • Adds note input field to the credential field editor modal
  • Notes are stored as note string in the credential JSON file
  • Notes are displayed on credential cards (2-line clamp for long text)
  • Empty notes are automatically removed from JSON on save

4. 国际化 / i18n

  • 所有新增文案已翻译为 zh-CNenru 三种语言
  • All new strings translated for zh-CN, en, and ru

改动文件 / Changed files

文件 / File 改动 / Change
AuthFileCard.tsx 显示 priority badge 和 note 文本 / Show priority badge and note text
AuthFilesPage.tsx 添加排序状态、排序逻辑、排序下拉框 / Add sort state, sorted memo, sort select UI
AuthFilesPage.module.scss priority、note、sort 样式 / Priority, note, and sort styles
AuthFilesPrefixProxyEditorModal.tsx 编辑弹窗增加 note 输入框 / Add note input field to editor modal
useAuthFilesPrefixProxyEditor.ts note 字段的读写逻辑 / Note field read/write logic
zh-CN.json / en.json / ru.json 新增 i18n 键 / Add i18n keys

测试计划 / Test plan

  • 含 priority 的凭证卡片显示 priority badge;不含则不显示 / Cards with priority show badge; without priority show none
  • A-Z 排序按名称字母序排列 / A-Z sort orders cards alphabetically
  • 优先级排序将高优先级凭证排在前面 / Priority sort places highest-priority credentials first
  • 默认排序保持 API 原始顺序 / Default sort preserves original API order
  • 所有排序模式下分页正常 / Pagination works correctly with all sort modes
  • 编辑弹窗中 note 字段可正常输入和保存 / Note field in editor modal is editable and saves correctly
  • 保存 note → 重新打开 → note 保持 / Save note → reopen → note persists
  • 清空 note → 保存 → note 从 JSON 中移除 / Clear note → save → note removed from JSON
  • 卡片上长备注截断为 2 行 / Long notes on cards are clamped to 2 lines
  • zh-CN、en、ru 翻译正确显示 / Translations display correctly in all three locales
  • TypeScript 类型检查和生产构建通过 / TypeScript type check and production build pass

🤖 Generated with Claude Code

RGBadmin and others added 2 commits March 14, 2026 11:01
- Show priority value on AuthFileCard when the credential has a priority field
- Add sort dropdown (Default / A-Z Name / Priority) to the credentials list
- Priority sort orders credentials from highest to lowest
- Add i18n translations for zh-CN, en, and ru

Co-Authored-By: Claude Opus 4.6 <[email protected]>
- Add note field to the credential field editor (PrefixProxyEditorModal)
- Store note as a string in the credential JSON file
- Display note on AuthFileCard with 2-line clamp for long text
- Note is saved when non-empty, removed from JSON when cleared
- Add i18n translations for zh-CN, en, and ru

Co-Authored-By: Claude Opus 4.6 <[email protected]>
@gemini-code-assist
Copy link
Contributor

Summary of Changes

Hello, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request significantly enhances the user experience of the Auth Files credential management page by integrating new features for better organization and information access. Users can now easily identify credential priorities, arrange their files using various sorting options, and add descriptive notes to each credential. These additions aim to streamline credential management and provide more contextual information directly within the UI.

Highlights

  • Priority Display: Implemented priority display for credential cards, showing a badge next to file size and modified time.
  • Sorting Functionality: Added sorting functionality to the Auth Files page, allowing users to sort by default API order, A-Z name, or priority (highest first).
  • Credential Notes: Introduced credential notes, enabling users to add, edit, and display notes on credential cards, with empty notes automatically removed upon saving.
  • Internationalization: Provided internationalization support for all new UI strings across Chinese, English, and Russian locales.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Changelog
  • src/features/authFiles/components/AuthFileCard.tsx
    • Added logic to parse and display a priority badge.
    • Implemented display for credential notes, truncated to two lines.
  • src/features/authFiles/components/AuthFilesPrefixProxyEditorModal.tsx
    • Integrated a new input field for credential notes into the editor modal.
  • src/features/authFiles/hooks/useAuthFilesPrefixProxyEditor.ts
    • Extended the editor state and logic to handle the 'note' field.
    • Implemented read/write operations for the 'note' field, including removing empty notes from the JSON.
  • src/i18n/locales/en.json
    • Added new translation keys for sorting options, priority display, and credential notes.
  • src/i18n/locales/ru.json
    • Added new translation keys for sorting options, priority display, and credential notes.
  • src/i18n/locales/zh-CN.json
    • Added new translation keys for sorting options, priority display, and credential notes.
  • src/pages/AuthFilesPage.module.scss
    • Defined styles for the priority badge, note text display, and the new sort select dropdown.
  • src/pages/AuthFilesPage.tsx
    • Introduced state management for sorting mode.
    • Implemented memoized sorting logic for credential files based on selected mode (default, A-Z, priority).
    • Updated pagination to reflect sorted data.
    • Added a sort selection dropdown to the filter bar.
Activity
  • This pull request is dependent on a backend change (CLIProxyAPI#2124) which needs to be merged first.
  • The initial code for this pull request was generated using Claude Code.
Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help /gemini help Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for GitHub and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

Copy link
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

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

Code Review

This pull request introduces priority display, sorting capabilities, and credential notes to the Auth Files management page. The changes are well-implemented across the UI components, state management hooks, and internationalization files. The new features are valuable additions for managing authentication credentials. I have included a couple of minor suggestions to enhance code clarity by removing redundant expressions. Overall, this is a well-executed enhancement.

const hasStatusWarning =
Boolean(rawStatusMessage) && !HEALTHY_STATUS_MESSAGES.has(rawStatusMessage.toLowerCase());

const priorityValue = parsePriorityValue(file.priority ?? file['priority']);
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

The expression file.priority ?? file['priority'] is redundant. Accessing a property with dot notation (file.priority) is equivalent to using bracket notation (file['priority']) for a valid identifier. You can simplify this for better readability.

Suggested change
const priorityValue = parsePriorityValue(file.priority ?? file['priority']);
const priorityValue = parsePriorityValue(file.priority);

Comment on lines +293 to +294
const pa = parsePriorityValue(a.priority ?? a['priority']) ?? 0;
const pb = parsePriorityValue(b.priority ?? b['priority']) ?? 0;
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

The expressions a.priority ?? a['priority'] and b.priority ?? b['priority'] are redundant. Accessing a property with dot notation is equivalent to bracket notation for valid identifiers. You can simplify this for better readability.

Suggested change
const pa = parsePriorityValue(a.priority ?? a['priority']) ?? 0;
const pb = parsePriorityValue(b.priority ?? b['priority']) ?? 0;
const pa = parsePriorityValue(a.priority) ?? 0;
const pb = parsePriorityValue(b.priority) ?? 0;

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant