Skip to content

Commit 24bf3de

Browse files
committed
add different icon + tooltip
1 parent dda1e5f commit 24bf3de

3 files changed

Lines changed: 81 additions & 36 deletions

File tree

extensions/src/platform-get-resources/contributions/localizedStrings.json

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,10 @@
4747
"%resources_type_XR%": "XML Resource",
4848
"%resources_type_unknown%": "Unknown resource type",
4949
"%resources_paratextProjects_label%": "Paratext Projects",
50+
"%resources_paratextProject_tooltip%": "Paratext Project ({0})",
51+
"%resources_resource_tooltip%": "Resource",
52+
"%resources_editable%": "editable",
53+
"%resources_readOnly%": "read-only",
5054
"%resources_resources_label%": "Resources",
5155
"%resources_update%": "Update",
5256
"%settings_get_resources_group1_label%": "Get Resources Project Settings",
@@ -99,6 +103,10 @@
99103
"%resources_type_XR%": "Recurso XML",
100104
"%resources_type_unknown%": "Tipo de recurso desconocido",
101105
"%resources_paratextProjects_label%": "Proyectos Paratext",
106+
"%resources_paratextProject_tooltip%": "Proyecto Paratext ({0})",
107+
"%resources_resource_tooltip%": "Recurso",
108+
"%resources_editable%": "editable",
109+
"%resources_readOnly%": "solo lectura",
102110
"%resources_resources_label%": "Recursos",
103111
"%resources_update%": "Actualizar",
104112
"%settings_get_resources_group1_label%": "Obtención de recursos",

extensions/src/platform-get-resources/src/home.component.tsx

Lines changed: 69 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BookOpen, ChevronDown, ChevronsUpDown, ChevronUp, ScrollText } from 'lucide-react';
1+
import { BookOpen, ChevronDown, ChevronsUpDown, ChevronUp, Scroll, ScrollText } from 'lucide-react';
22
import {
33
Button,
44
Card,
@@ -11,6 +11,10 @@ import {
1111
SearchBar,
1212
Spinner,
1313
Table,
14+
Tooltip,
15+
TooltipContent,
16+
TooltipProvider,
17+
TooltipTrigger,
1418
TableBody,
1519
TableCell,
1620
TableHead,
@@ -56,6 +60,10 @@ export const HOME_STRING_KEYS = Object.freeze([
5660
'%resources_searchedFor%',
5761
'%resources_sync%',
5862
'%resources_paratextProjects_label%',
63+
'%resources_paratextProject_tooltip%',
64+
'%resources_resource_tooltip%',
65+
'%resources_editable%',
66+
'%resources_readOnly%',
5967
'%resources_resources_label%',
6068
] as const);
6169

@@ -211,6 +219,12 @@ export function Home({
211219
const searchedForText: string = getLocalizedString('%resources_searchedFor%');
212220
const syncText: string = getLocalizedString('%resources_sync%');
213221
const paratextProjectsText: string = getLocalizedString('%resources_paratextProjects_label%');
222+
const paratextProjectTooltipText: string = getLocalizedString(
223+
'%resources_paratextProject_tooltip%',
224+
);
225+
const resourceTooltipText: string = getLocalizedString('%resources_resource_tooltip%');
226+
const editableText: string = getLocalizedString('%resources_editable%');
227+
const readOnlyText: string = getLocalizedString('%resources_readOnly%');
214228
const resourcesText: string = getLocalizedString('%resources_resources_label%');
215229

216230
const mergedProjectInfo: MergedProjectInfo[] = useMemo(() => {
@@ -528,43 +542,62 @@ export function Home({
528542
<TableCell
529543
className={cn({ 'tw-ps-2': project.editedStatus === 'edited' })}
530544
>
531-
<div
532-
className={cn(
533-
'tw-flex tw-flex-row tw-items-center tw-gap-4 tw-ps-2',
534-
{ 'tw-ps-0': project.editedStatus === 'edited' },
535-
)}
536-
>
537-
<div className="tw-flex tw-flex-row tw-items-center tw-gap-2">
538-
{project.editedStatus === 'edited' && (
539-
<div className="tw-rounded-full tw-bg-primary tw-h-2 tw-w-2 tw-m-[-10px]" />
540-
)}
541-
{(() => {
542-
const Icon = project.isResource ? BookOpen : ScrollText;
543-
return <Icon className="tw-h-4 tw-w-4" />;
544-
})()}
545-
</div>
545+
<TooltipProvider>
546+
<Tooltip>
547+
<TooltipTrigger asChild>
548+
<div
549+
className={cn(
550+
'tw-flex tw-flex-row tw-items-center tw-gap-4 tw-ps-2',
551+
{ 'tw-ps-0': project.editedStatus === 'edited' },
552+
)}
553+
>
554+
<div className="tw-flex tw-flex-row tw-items-center tw-gap-2">
555+
{project.editedStatus === 'edited' && (
556+
<div className="tw-rounded-full tw-bg-primary tw-h-2 tw-w-2 tw-m-[-10px]" />
557+
)}
558+
{(() => {
559+
let Icon = ScrollText;
560+
if (project.isResource) Icon = BookOpen;
561+
else if (!project.isEditable) Icon = Scroll;
562+
return <Icon className="tw-h-4 tw-w-4" />;
563+
})()}
564+
</div>
546565

547-
<div className="tw-whitespace-nowrap tw-cursor-default">
548-
{project.name}
549-
</div>
566+
<div className="tw-whitespace-nowrap tw-cursor-default">
567+
{project.name}
568+
</div>
550569

551-
<div className="tw-grow tw-hidden max-[300px]:!tw-flex">
552-
<div className="tw-grow" />
553-
<HomeItemDropdownMenu ellipsisButtonClassName="tw-h-6">
554-
{(!project.isLocallyAvailable ||
555-
project.editedStatus === 'edited') && (
556-
<DropdownMenuItem asChild>
557-
{syncOrGetButton(project, true)}
558-
</DropdownMenuItem>
559-
)}
560-
{project.isLocallyAvailable && (
561-
<DropdownMenuItem asChild>
562-
{openButton(project, true)}
563-
</DropdownMenuItem>
564-
)}
565-
</HomeItemDropdownMenu>
566-
</div>
567-
</div>
570+
<div className="tw-grow tw-hidden max-[300px]:!tw-flex">
571+
<div className="tw-grow" />
572+
<HomeItemDropdownMenu ellipsisButtonClassName="tw-h-6">
573+
{(!project.isLocallyAvailable ||
574+
project.editedStatus === 'edited') && (
575+
<DropdownMenuItem asChild>
576+
{syncOrGetButton(project, true)}
577+
</DropdownMenuItem>
578+
)}
579+
{project.isLocallyAvailable && (
580+
<DropdownMenuItem asChild>
581+
{openButton(project, true)}
582+
</DropdownMenuItem>
583+
)}
584+
</HomeItemDropdownMenu>
585+
</div>
586+
</div>
587+
</TooltipTrigger>
588+
<TooltipContent>
589+
<div>{project.fullName}</div>
590+
<div>
591+
{project.isResource
592+
? resourceTooltipText
593+
: paratextProjectTooltipText.replace(
594+
'{0}',
595+
project.isEditable ? editableText : readOnlyText,
596+
)}
597+
</div>
598+
</TooltipContent>
599+
</Tooltip>
600+
</TooltipProvider>
568601
</TableCell>
569602
<TableCell className="tw-hidden md:!tw-table-cell tw-font-medium tw-break-words tw-cursor-default tw-break-all">
570603
{project.fullName}

extensions/src/platform-get-resources/src/home.stories.tsx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -162,6 +162,10 @@ function DefaultHomeDecorator(Story: (update?: { args: HomeProps }) => ReactElem
162162
'%resources_shortNameText%': 'Name',
163163
'%resources_filter_all%': 'All',
164164
'%resources_paratextProjects_label%': 'Paratext Projects',
165+
'%resources_paratextProject_tooltip%': 'Paratext Project ({0})',
166+
'%resources_resource_tooltip%': 'Resource',
167+
'%resources_editable%': 'editable',
168+
'%resources_readOnly%': 'read-only',
165169
'%resources_resources_label%': 'Resources',
166170
'%resources_noItemsFound%': 'No {0} found.',
167171
'%resources_items%': 'items',

0 commit comments

Comments
 (0)