From 6ce9d24534341f8778b618854c2c434fae1a7b7c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=94=A1=E5=8F=8A?= <522caiji@gmail.com>
Date: Sat, 26 Sep 2026 16:06:42 +0800
Subject: [PATCH] fix(console): hide add-account type descriptions until hover
Keep the add-account type cards to icon and title, and show login details from an info button instead of inline copy.
---
.../unreleased/add-account-type-hints.md | 7 +++
frontend/src/components/AddAccountModal.tsx | 10 +---
frontend/src/components/ui/OptionTiles.tsx | 55 +++++++++++++------
...t-Cgra9egu.js => TrafficChart-OPQEYEbm.js} | 2 +-
...{index-BjsOfFoj.css => index-BEwWCUnU.css} | 2 +-
.../{index-2slrySyr.js => index-oNlXVfto.js} | 4 +-
internal/webui/static/index.html | 4 +-
7 files changed, 55 insertions(+), 29 deletions(-)
create mode 100644 changelog/unreleased/add-account-type-hints.md
rename internal/webui/static/assets/{TrafficChart-Cgra9egu.js => TrafficChart-OPQEYEbm.js} (99%)
rename internal/webui/static/assets/{index-BjsOfFoj.css => index-BEwWCUnU.css} (93%)
rename internal/webui/static/assets/{index-2slrySyr.js => index-oNlXVfto.js} (97%)
diff --git a/changelog/unreleased/add-account-type-hints.md b/changelog/unreleased/add-account-type-hints.md
new file mode 100644
index 0000000..7cd07dc
--- /dev/null
+++ b/changelog/unreleased/add-account-type-hints.md
@@ -0,0 +1,7 @@
+### English
+
+- The add-account type cards now show only the icon and title. Login details appear when you hover the info button.
+
+### 中文
+
+- 添加账号的类型卡片现在只显示图标和标题。登录方式等说明放到信息按钮上,悬停后再展开。
diff --git a/frontend/src/components/AddAccountModal.tsx b/frontend/src/components/AddAccountModal.tsx
index b3bdafc..3d7ac35 100644
--- a/frontend/src/components/AddAccountModal.tsx
+++ b/frontend/src/components/AddAccountModal.tsx
@@ -70,12 +70,9 @@ function AccountTypeSkeleton({ ariaLabel }: { ariaLabel: string }) {
return (
{Array.from({ length: 4 }, (_, index) => (
-
@@ -478,7 +475,6 @@ export function AddAccountModal({ isOpen, onClose, onAdded }: Props) {
/>
>
)}
- {typesReady && hint ?
{hint}
: null}
diff --git a/frontend/src/components/ui/OptionTiles.tsx b/frontend/src/components/ui/OptionTiles.tsx
index d809dbc..a59c6ad 100644
--- a/frontend/src/components/ui/OptionTiles.tsx
+++ b/frontend/src/components/ui/OptionTiles.tsx
@@ -1,5 +1,6 @@
import type { ReactNode } from 'react'
-import { Description, Label, Radio, RadioGroup } from '@heroui/react'
+import { Button, Label, Radio, RadioGroup, Tooltip } from '@heroui/react'
+import { Info } from '@phosphor-icons/react'
type Option = {
value: T
@@ -42,23 +43,45 @@ export function OptionTiles({
className={`grid gap-2 ${columnClass[columns]} ${className}`.trim()}
>
{options.map((option) => (
-
-
- {option.icon ? {option.icon} : null}
-
-
-
-
-
- {option.hint ? {option.hint} : null}
-
-
-
+
+
+ {option.icon ? {option.icon} : null}
+
+
+
+
+
+
+
+
+ {option.hint ? (
+
+
+
+
+
+ {option.hint}
+
+
+ ) : null}
+
))}
)
diff --git a/internal/webui/static/assets/TrafficChart-Cgra9egu.js b/internal/webui/static/assets/TrafficChart-OPQEYEbm.js
similarity index 99%
rename from internal/webui/static/assets/TrafficChart-Cgra9egu.js
rename to internal/webui/static/assets/TrafficChart-OPQEYEbm.js
index 6396216..d4a1e44 100644
--- a/internal/webui/static/assets/TrafficChart-Cgra9egu.js
+++ b/internal/webui/static/assets/TrafficChart-OPQEYEbm.js
@@ -1,4 +1,4 @@
-import{a as e,c as t,d as n,i as r,l as i,n as a,o,r as s,s as c,t as l,u}from"./index-2slrySyr.js";var d=`dangerouslySetInnerHTML.onCopy.onCopyCapture.onCut.onCutCapture.onPaste.onPasteCapture.onCompositionEnd.onCompositionEndCapture.onCompositionStart.onCompositionStartCapture.onCompositionUpdate.onCompositionUpdateCapture.onFocus.onFocusCapture.onBlur.onBlurCapture.onChange.onChangeCapture.onBeforeInput.onBeforeInputCapture.onInput.onInputCapture.onReset.onResetCapture.onSubmit.onSubmitCapture.onInvalid.onInvalidCapture.onLoad.onLoadCapture.onError.onErrorCapture.onKeyDown.onKeyDownCapture.onKeyPress.onKeyPressCapture.onKeyUp.onKeyUpCapture.onAbort.onAbortCapture.onCanPlay.onCanPlayCapture.onCanPlayThrough.onCanPlayThroughCapture.onDurationChange.onDurationChangeCapture.onEmptied.onEmptiedCapture.onEncrypted.onEncryptedCapture.onEnded.onEndedCapture.onLoadedData.onLoadedDataCapture.onLoadedMetadata.onLoadedMetadataCapture.onLoadStart.onLoadStartCapture.onPause.onPauseCapture.onPlay.onPlayCapture.onPlaying.onPlayingCapture.onProgress.onProgressCapture.onRateChange.onRateChangeCapture.onSeeked.onSeekedCapture.onSeeking.onSeekingCapture.onStalled.onStalledCapture.onSuspend.onSuspendCapture.onTimeUpdate.onTimeUpdateCapture.onVolumeChange.onVolumeChangeCapture.onWaiting.onWaitingCapture.onAuxClick.onAuxClickCapture.onClick.onClickCapture.onContextMenu.onContextMenuCapture.onDoubleClick.onDoubleClickCapture.onDrag.onDragCapture.onDragEnd.onDragEndCapture.onDragEnter.onDragEnterCapture.onDragExit.onDragExitCapture.onDragLeave.onDragLeaveCapture.onDragOver.onDragOverCapture.onDragStart.onDragStartCapture.onDrop.onDropCapture.onMouseDown.onMouseDownCapture.onMouseEnter.onMouseLeave.onMouseMove.onMouseMoveCapture.onMouseOut.onMouseOutCapture.onMouseOver.onMouseOverCapture.onMouseUp.onMouseUpCapture.onSelect.onSelectCapture.onTouchCancel.onTouchCancelCapture.onTouchEnd.onTouchEndCapture.onTouchMove.onTouchMoveCapture.onTouchStart.onTouchStartCapture.onPointerDown.onPointerDownCapture.onPointerMove.onPointerMoveCapture.onPointerUp.onPointerUpCapture.onPointerCancel.onPointerCancelCapture.onPointerEnter.onPointerEnterCapture.onPointerLeave.onPointerLeaveCapture.onPointerOver.onPointerOverCapture.onPointerOut.onPointerOutCapture.onGotPointerCapture.onGotPointerCaptureCapture.onLostPointerCapture.onLostPointerCaptureCapture.onScroll.onScrollCapture.onWheel.onWheelCapture.onAnimationStart.onAnimationStartCapture.onAnimationEnd.onAnimationEndCapture.onAnimationIteration.onAnimationIterationCapture.onTransitionEnd.onTransitionEndCapture`.split(`.`);function f(e){return typeof e==`string`&&d.includes(e)}var p=n(t()),m=new Set(`aria-activedescendant.aria-atomic.aria-autocomplete.aria-busy.aria-checked.aria-colcount.aria-colindex.aria-colspan.aria-controls.aria-current.aria-describedby.aria-details.aria-disabled.aria-errormessage.aria-expanded.aria-flowto.aria-haspopup.aria-hidden.aria-invalid.aria-keyshortcuts.aria-label.aria-labelledby.aria-level.aria-live.aria-modal.aria-multiline.aria-multiselectable.aria-orientation.aria-owns.aria-placeholder.aria-posinset.aria-pressed.aria-readonly.aria-relevant.aria-required.aria-roledescription.aria-rowcount.aria-rowindex.aria-rowspan.aria-selected.aria-setsize.aria-sort.aria-valuemax.aria-valuemin.aria-valuenow.aria-valuetext.className.color.height.id.lang.max.media.method.min.name.style.target.width.role.tabIndex.accentHeight.accumulate.additive.alignmentBaseline.allowReorder.alphabetic.amplitude.arabicForm.ascent.attributeName.attributeType.autoReverse.azimuth.baseFrequency.baselineShift.baseProfile.bbox.begin.bias.by.calcMode.capHeight.clip.clipPath.clipPathUnits.clipRule.colorInterpolation.colorInterpolationFilters.colorProfile.colorRendering.contentScriptType.contentStyleType.cursor.cx.cy.d.decelerate.descent.diffuseConstant.direction.display.divisor.dominantBaseline.dur.dx.dy.edgeMode.elevation.enableBackground.end.exponent.externalResourcesRequired.fill.fillOpacity.fillRule.filter.filterRes.filterUnits.floodColor.floodOpacity.focusable.fontFamily.fontSize.fontSizeAdjust.fontStretch.fontStyle.fontVariant.fontWeight.format.from.fx.fy.g1.g2.glyphName.glyphOrientationHorizontal.glyphOrientationVertical.glyphRef.gradientTransform.gradientUnits.hanging.horizAdvX.horizOriginX.href.ideographic.imageRendering.in2.in.intercept.k1.k2.k3.k4.k.kernelMatrix.kernelUnitLength.kerning.keyPoints.keySplines.keyTimes.lengthAdjust.letterSpacing.lightingColor.limitingConeAngle.local.markerEnd.markerHeight.markerMid.markerStart.markerUnits.markerWidth.mask.maskContentUnits.maskUnits.mathematical.mode.numOctaves.offset.opacity.operator.order.orient.orientation.origin.overflow.overlinePosition.overlineThickness.paintOrder.panose1.pathLength.patternContentUnits.patternTransform.patternUnits.pointerEvents.pointsAtX.pointsAtY.pointsAtZ.preserveAlpha.preserveAspectRatio.primitiveUnits.r.radius.refX.refY.renderingIntent.repeatCount.repeatDur.requiredExtensions.requiredFeatures.restart.result.rotate.rx.ry.seed.shapeRendering.slope.spacing.specularConstant.specularExponent.speed.spreadMethod.startOffset.stdDeviation.stemh.stemv.stitchTiles.stopColor.stopOpacity.strikethroughPosition.strikethroughThickness.string.stroke.strokeDasharray.strokeDashoffset.strokeLinecap.strokeLinejoin.strokeMiterlimit.strokeOpacity.strokeWidth.surfaceScale.systemLanguage.tableValues.targetX.targetY.textAnchor.textDecoration.textLength.textRendering.to.transform.u1.u2.underlinePosition.underlineThickness.unicode.unicodeBidi.unicodeRange.unitsPerEm.vAlphabetic.values.vectorEffect.version.vertAdvY.vertOriginX.vertOriginY.vHanging.vIdeographic.viewTarget.visibility.vMathematical.widths.wordSpacing.writingMode.x1.x2.x.xChannelSelector.xHeight.xlinkActuate.xlinkArcrole.xlinkHref.xlinkRole.xlinkShow.xlinkTitle.xlinkType.xmlBase.xmlLang.xmlns.xmlnsXlink.xmlSpace.y1.y2.y.yChannelSelector.z.zoomAndPan.ref.key.angle`.split(`.`));function h(e){return typeof e==`string`&&m.has(e)}function g(e){return typeof e==`string`&&e.startsWith(`data-`)}function _(e){if(typeof e!=`object`||!e)return{};var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(h(n)||g(n))&&(t[n]=e[n]);return t}function v(e){if(e==null)return null;if((0,p.isValidElement)(e)&&typeof e.props==`object`&&e.props!==null){var t=e.props;return _(t)}return typeof e==`object`&&!Array.isArray(e)?_(e):null}function y(e){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(h(n)||g(n)||f(n))&&(t[n]=e[n]);return t}function b(e){return e==null?null:(0,p.isValidElement)(e)?y(e.props):typeof e==`object`&&!Array.isArray(e)?y(e):null}var x=[`children`,`width`,`height`,`viewBox`,`className`,`style`,`title`,`desc`];function S(){return S=Object.assign?Object.assign.bind():function(e){for(var t=1;t