mirror of
https://github.com/aykhans/slash-e.git
synced 2025-04-16 12:23:12 +00:00
chore: update shortcut view
This commit is contained in:
Steven
parent
b365355610
commit
f83c21cc93
@ -166,6 +166,7 @@ func (s *Store) UpdateShortcut(ctx context.Context, update *UpdateShortcut) (*st
|
||||
}
|
||||
shortcut.RowStatus = convertRowStatusStringToStorepb(rowStatus)
|
||||
shortcut.Visibility = convertVisibilityStringToStorepb(visibility)
|
||||
shortcut.Tags = filterTags(strings.Split(tags, " "))
|
||||
var ogMetadata storepb.OpenGraphMetadata
|
||||
if err := protojson.Unmarshal([]byte(openGraphMetadataString), &ogMetadata); err != nil {
|
||||
return nil, err
|
||||
@ -247,7 +248,7 @@ func (s *Store) ListShortcuts(ctx context.Context, find *FindShortcut) ([]*store
|
||||
}
|
||||
shortcut.RowStatus = convertRowStatusStringToStorepb(rowStatus)
|
||||
shortcut.Visibility = storepb.Visibility(storepb.Visibility_value[visibility])
|
||||
shortcut.Tags = strings.Split(tags, " ")
|
||||
shortcut.Tags = filterTags(strings.Split(tags, " "))
|
||||
var ogMetadata storepb.OpenGraphMetadata
|
||||
if err := protojson.Unmarshal([]byte(openGraphMetadataString), &ogMetadata); err != nil {
|
||||
return nil, err
|
||||
@ -315,6 +316,16 @@ func vacuumShortcut(ctx context.Context, tx *sql.Tx) error {
|
||||
return nil
|
||||
}
|
||||
|
||||
func filterTags(tags []string) []string {
|
||||
result := []string{}
|
||||
for _, tag := range tags {
|
||||
if tag != "" {
|
||||
result = append(result, tag)
|
||||
}
|
||||
}
|
||||
return result
|
||||
}
|
||||
|
||||
func convertVisibilityStringToStorepb(visibility string) storepb.Visibility {
|
||||
return storepb.Visibility(storepb.Visibility_value[visibility])
|
||||
}
|
||||
|
||||
@ -59,26 +59,35 @@ const ShortcutView = (props: Props) => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="w-full flex flex-col justify-start items-start border px-4 py-3 rounded-lg hover:shadow">
|
||||
<div className="group w-full flex flex-col justify-start items-start border px-4 py-3 rounded-lg hover:shadow">
|
||||
<div className="w-full flex flex-row justify-between items-center">
|
||||
<div className="group flex flex-row justify-start items-center pr-2 mr-1 shrink-0">
|
||||
<Link to={`/shortcut/${shortcut.id}`} className="w-8 h-8 mr-1 flex justify-center items-center overflow-clip">
|
||||
<div className="w-[calc(100%-16px)] flex flex-row justify-start items-center pr-2 mr-1 shrink-0">
|
||||
<Link to={`/shortcut/${shortcut.id}`} className="w-8 h-8 flex justify-center items-center overflow-clip shrink-0">
|
||||
{favicon ? (
|
||||
<img className="w-full h-auto rounded-full" src={favicon} decoding="async" loading="lazy" />
|
||||
) : (
|
||||
<Icon.CircleSlash className="w-8 h-auto text-gray-400" />
|
||||
)}
|
||||
</Link>
|
||||
<div className="flex flex-col justify-start items-start">
|
||||
<div className="flex flex-row justify-start items-center">
|
||||
<div className="ml-1 w-[calc(100%-32px)] flex flex-col justify-start items-start">
|
||||
<div className="w-full flex flex-row justify-start items-center">
|
||||
<a
|
||||
className="flex flex-row px-1 mr-1 justify-start items-center cursor-pointer rounded-md hover:bg-gray-100 hover:shadow"
|
||||
className="max-w-[calc(100%-32px)] flex flex-row px-1 mr-1 justify-start items-center cursor-pointer rounded-md hover:bg-gray-100 hover:shadow"
|
||||
target="_blank"
|
||||
href={shortcutLink}
|
||||
>
|
||||
<span className="text-gray-400">s/</span>
|
||||
<span className="max-w-[14rem] truncate">{shortcut.name}</span>
|
||||
<span className="hidden group-hover:block ml-1 cursor-pointer">
|
||||
<div className="truncate">
|
||||
<span>{shortcut.title}</span>
|
||||
{shortcut.title ? (
|
||||
<span className="text-gray-400">(s/{shortcut.name})</span>
|
||||
) : (
|
||||
<>
|
||||
<span className="text-gray-400">s/</span>
|
||||
<span className="truncate">{shortcut.name}</span>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
<span className="hidden group-hover:block ml-1 cursor-pointer shrink-0">
|
||||
<Icon.ExternalLink className="w-4 h-auto text-gray-600" />
|
||||
</span>
|
||||
</a>
|
||||
@ -90,21 +99,13 @@ const ShortcutView = (props: Props) => {
|
||||
<Icon.Clipboard className="w-4 h-auto mx-auto" />
|
||||
</button>
|
||||
</Tooltip>
|
||||
<Tooltip title="QR Code" variant="solid" placement="top" arrow>
|
||||
<button
|
||||
className="hidden group-hover:block ml-1 w-6 h-6 cursor-pointer rounded-md text-gray-500 hover:bg-gray-100 hover:shadow"
|
||||
onClick={() => setShowQRCodeDialog(true)}
|
||||
>
|
||||
<Icon.QrCode className="w-4 h-auto mx-auto" />
|
||||
</button>
|
||||
</Tooltip>
|
||||
</div>
|
||||
<a className="ml-1 text-sm max-w-[16rem] truncate text-gray-400 hover:underline" href={shortcut.link} target="_blank">
|
||||
<a className="ml-1 w-full text-sm truncate text-gray-400 hover:underline" href={shortcut.link} target="_blank">
|
||||
{shortcut.link}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-row justify-end items-center space-x-2">
|
||||
<div className="flex flex-row justify-end items-center">
|
||||
{havePermission && (
|
||||
<Dropdown
|
||||
actionsClassName="!w-32"
|
||||
@ -116,6 +117,12 @@ const ShortcutView = (props: Props) => {
|
||||
>
|
||||
<Icon.Edit className="w-4 h-auto mr-2" /> Edit
|
||||
</button>
|
||||
<button
|
||||
className="w-full px-2 flex flex-row justify-start items-center text-left leading-8 cursor-pointer rounded hover:bg-gray-100 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:opacity-60"
|
||||
onClick={() => setShowQRCodeDialog(true)}
|
||||
>
|
||||
<Icon.QrCode className="w-4 h-auto mr-2" /> QR Code
|
||||
</button>
|
||||
<button
|
||||
className="w-full px-2 flex flex-row justify-start items-center text-left leading-8 cursor-pointer rounded hover:bg-gray-100 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:opacity-60"
|
||||
onClick={() => setShowAnalyticsDialog(true)}
|
||||
@ -136,6 +143,20 @@ const ShortcutView = (props: Props) => {
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-2 w-full flex flex-row justify-start items-start gap-2 truncate">
|
||||
{shortcut.tags.map((tag) => {
|
||||
return (
|
||||
<span
|
||||
key={tag}
|
||||
className="max-w-[8rem] truncate text-gray-400 text-sm font-mono leading-4 cursor-pointer hover:text-gray-600"
|
||||
onClick={() => viewStore.setFilter({ tag: tag })}
|
||||
>
|
||||
#{tag}
|
||||
</span>
|
||||
);
|
||||
})}
|
||||
{shortcut.tags.length === 0 && <span className="text-gray-400 text-sm font-mono leading-4 italic">No tags</span>}
|
||||
</div>
|
||||
<div className="w-full flex mt-2 gap-2">
|
||||
<Tooltip title="Creator" variant="solid" placement="top" arrow>
|
||||
<div className="w-auto px-2 leading-6 flex flex-row justify-start items-center border rounded-full text-gray-500 text-sm">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user