support switch profile display date

changelog.md

@@ -4,10 +4,4 @@
 
 ### New Features
 
-- 修改应用在 macOS 和 Linux 下的显示名称为 `Mihomo Party`
+- 允许切换订阅卡片显示过期时间还是更新时间
-- 默认禁用外部控制端口
-
-### Bug Fixes
-
-- 修复 TrafficMonitor 勾选内置网速显示后无法取消勾选的问题
-- 修复 TrafficMonitor 显示宽度不正确的问题

src/renderer/src/components/profiles/profile-item.tsx

@@ -20,6 +20,7 @@ import EditInfoModal from './edit-info-modal'
 import { useSortable } from '@dnd-kit/sortable'
 import { CSS } from '@dnd-kit/utilities'
 import { openFile } from '@renderer/utils/ipc'
+import { useAppConfig } from '@renderer/hooks/use-app-config'
 
 interface Props {
   info: IProfileItem
@@ -51,6 +52,8 @@ const ProfileItem: React.FC<Props> = (props) => {
   const extra = info?.extra
   const usage = (extra?.upload ?? 0) + (extra?.download ?? 0)
   const total = extra?.total ?? 0
+  const { appConfig, patchAppConfig } = useAppConfig()
+  const { profileDisplayDate = 'expire' } = appConfig || {}
   const [updating, setUpdating] = useState(false)
   const [selecting, setSelecting] = useState(false)
   const [openInfoEditor, setOpenInfoEditor] = useState(false)
@@ -171,7 +174,7 @@ const ProfileItem: React.FC<Props> = (props) => {
       <Card
         fullWidth
         isPressable
-        onPress={() => {
+        onClick={() => {
           if (disableSelect) return
           setSelecting(true)
           onClick().finally(() => {
@@ -240,12 +243,22 @@ const ProfileItem: React.FC<Props> = (props) => {
           </div>
           {info.type === 'remote' && extra && (
             <div
+              onClick={(e) => {
+                e.stopPropagation()
+                patchAppConfig({
+                  profileDisplayDate: profileDisplayDate === 'expire' ? 'update' : 'expire'
+                })
+              }}
               className={`mt-2 flex justify-between ${isCurrent ? 'text-primary-foreground' : 'text-foreground'}`}
             >
               <small>{`${calcTraffic(usage)}/${calcTraffic(total)}`}</small>
+              {profileDisplayDate === 'expire' ? (
                 <small>
                   {extra.expire ? dayjs.unix(extra.expire).format('YYYY-MM-DD') : '长期有效'}
                 </small>
+              ) : (
+                <small>{dayjs(info.updated).fromNow()}</small>
+              )}
             </div>
           )}
           {info.type === 'local' && (

src/renderer/src/components/sider/profile-card.tsx

@@ -19,7 +19,7 @@ dayjs.locale('zh-cn')
 
 const ProfileCard: React.FC = () => {
   const { appConfig } = useAppConfig()
-  const { profileCardStatus = 'col-span-2' } = appConfig || {}
+  const { profileCardStatus = 'col-span-2', profileDisplayDate = 'expire' } = appConfig || {}
   const location = useLocation()
   const match = location.pathname.includes('/profiles')
   const [updating, setUpdating] = useState(false)
@@ -121,9 +121,13 @@ const ProfileCard: React.FC = () => {
                 className={`mt-2 flex justify-between ${match ? 'text-primary-foreground' : 'text-foreground'} `}
               >
                 <small>{`${calcTraffic(usage)}/${calcTraffic(total)}`}</small>
+                {profileDisplayDate === 'expire' ? (
                   <small>
                     {extra.expire ? dayjs.unix(extra.expire).format('YYYY-MM-DD') : '长期有效'}
                   </small>
+                ) : (
+                  <small>{dayjs(info.updated).fromNow()}</small>
+                )}
               </div>
             )}
             {info.type === 'local' && (

src/shared/types.d.ts

@@ -207,6 +207,7 @@ interface IAppConfig {
   core: 'mihomo' | 'mihomo-alpha'
   proxyDisplayMode: 'simple' | 'full'
   proxyDisplayOrder: 'default' | 'delay' | 'name'
+  profileDisplayDate?: 'expire' | 'update'
   envType?: ('bash' | 'cmd' | 'powershell')[]
   proxyCols: 'auto' | '1' | '2' | '3' | '4'
   connectionDirection: 'asc' | 'desc'