aykhans/slash-e
1
0
Fork 0
mirror of https://github.com/aykhans/slash-e.git synced 2025-04-20 22:07:15 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: display view count in UI

Browse Source
This commit is contained in:
Steven 2023-06-24 16:14:17 +08:00
parent 19cdea6bca
commit 5fb9b67a53
2 changed files with 50 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
web/src/components/ShortcutListView.tsx
View File

@ -44,26 +44,14 @@ const ShortcutListView: React.FC<Props> = (props: Props) => {
<div className="w-full flex flex-col justify-start items-start">
{shortcutList.map((shortcut) => {
return (
<div key={shortcut.id} className="w-full flex flex-row justify-between items-start border px-4 py-3 mb-2 rounded-lg">
<div className="flex flex-col justify-start items-start mr-4">
<p>
<div key={shortcut.id} className="w-full flex flex-col justify-start items-start border px-4 py-3 mb-2 rounded-lg">
<div className="w-full flex flex-row justify-between items-center">
<p className="text-lg mr-1 shrink-0">
<span className="cursor-pointer hover:opacity-80" onClick={() => handleCopyButtonClick(shortcut)}>
<span className="text-gray-400">o/</span>
{shortcut.name}
</span>
</p>
{shortcut.description && <p className="mt-1 text-gray-400 text-sm">{shortcut.description}</p>}
<div className="mt-2 flex flex-row justify-start items-start gap-2">
<Icon.Tag className="text-gray-400 w-4 h-auto" />
{shortcut.tags.map((tag) => {
return (
<span key={tag} className="text-gray-400 text-sm font-mono leading-4">
#{tag}
</span>
);
})}
</div>
</div>
<div className="flex flex-row justify-end items-center space-x-2">
<Tooltip title="Copy link" variant="solid" placement="top">
<button className="cursor-pointer hover:opacity-80" onClick={() => handleCopyButtonClick(shortcut)}>
@ -100,6 +88,29 @@ const ShortcutListView: React.FC<Props> = (props: Props) => {
></Dropdown>
</div>
</div>
{shortcut.description && <p className="mt-1 text-gray-400 text-sm">{shortcut.description}</p>}
{/* TODO(steven): display shortcut's tags later */}
{shortcut.tags.length > 0 && false && (
<div className="mt-2 flex flex-row justify-start items-start gap-2">
<Icon.Tag className="text-gray-400 w-4 h-auto" />
{shortcut.tags.map((tag) => {
return (
<span key={tag} className="text-gray-400 text-sm font-mono leading-4">
#{tag}
</span>
);
})}
</div>
)}
<div className="w-full flex mt-2">
<Tooltip title="View count" variant="solid" placement="top">
<div className="w-auto px-2 pr-3 leading-6 flex flex-row justify-start items-center border rounded-full text-gray-500 font-mono text-sm">
<Icon.Eye className="w-4 h-auto mr-1" />
{shortcut.view}
</div>
</Tooltip>
</div>
</div>
);
})}
</div>

1
web/src/types/modules/shortcut.d.ts vendored
View File

@ -16,6 +16,7 @@ interface Shortcut {
description: string;
visibility: Visibility;
tags: string[];
view: number;
}
interface ShortcutCreate {