Fixed title to also have a description

This commit is contained in:
Connor Yoh 2025-09-05 15:09:53 +01:00
parent 977fdc0ea5
commit a63708bb3f
4 changed files with 25 additions and 25 deletions

View File

@ -1469,6 +1469,7 @@
"tags": "auto-detect,header-based,organize,relabel", "tags": "auto-detect,header-based,organize,relabel",
"title": "Auto Rename", "title": "Auto Rename",
"header": "Auto Rename PDF", "header": "Auto Rename PDF",
"description": "Automatically finds the best title from your PDF content and uses it as the filename.",
"submit": "Auto Rename", "submit": "Auto Rename",
"files": { "files": {
"placeholder": "Select a PDF file in the main view to get started" "placeholder": "Select a PDF file in the main view to get started"

View File

@ -5,6 +5,7 @@ import { Tooltip } from '../../shared/Tooltip';
export interface ToolWorkflowTitleProps { export interface ToolWorkflowTitleProps {
title: string; title: string;
description?: string;
tooltip?: { tooltip?: {
content?: React.ReactNode; content?: React.ReactNode;
tips?: any[]; tips?: any[];
@ -15,10 +16,19 @@ export interface ToolWorkflowTitleProps {
}; };
} }
export function ToolWorkflowTitle({ title, tooltip }: ToolWorkflowTitleProps) { export function ToolWorkflowTitle({ title, tooltip, description }: ToolWorkflowTitleProps) {
if (tooltip) { const titleContent = (
return ( <Flex align="center" gap="xs" onClick={(e) => e.stopPropagation()}>
<> <Text fw={500} size="lg" p="xs">
{title}
</Text>
{tooltip && <LocalIcon icon="gpp-maybe-outline-rounded" width="1.25rem" height="1.25rem" style={{ color: 'var(--icon-files-color)' }} />}
</Flex>
);
return (
<>
{tooltip ? (
<Flex justify="center" w="100%"> <Flex justify="center" w="100%">
<Tooltip <Tooltip
content={tooltip.content} content={tooltip.content}
@ -26,27 +36,17 @@ export function ToolWorkflowTitle({ title, tooltip }: ToolWorkflowTitleProps) {
header={tooltip.header} header={tooltip.header}
sidebarTooltip={true} sidebarTooltip={true}
> >
<Flex align="center" gap="xs" onClick={(e) => e.stopPropagation()}> {titleContent}
<Text fw={500} size="xl" p="md">
{title}
</Text>
<LocalIcon icon="gpp-maybe-outline-rounded" width="1.25rem" height="1.25rem" style={{ color: 'var(--icon-files-color)' }} />
</Flex>
</Tooltip> </Tooltip>
</Flex> </Flex>
<Divider /> ) : (
</> titleContent
); )}
}
return ( <Text size="sm" mb="md" p="sm" style={{borderRadius:'var(--mantine-radius-md)', background: 'var(--color-gray-200)', color: 'var(--mantine-color-text)' }}>
<> {description}
<Flex justify="center" w="100%"> </Text>
<Text fw={500} size="xl" p="md"> <Divider mb="sm" />
{title}
</Text>
</Flex>
<Divider />
</> </>
); );
} }

View File

@ -11,7 +11,6 @@ export const useAutoRenameTips = (): TooltipContent => {
tips: [ tips: [
{ {
title: t("auto-rename.tooltip.howItWorks.title", "Smart Renaming"), title: t("auto-rename.tooltip.howItWorks.title", "Smart Renaming"),
description: t("auto-rename.tooltip.howItWorks.text", "Automatically finds the best title from your PDF content and uses it as the filename."),
bullets: [ bullets: [
t("auto-rename.tooltip.howItWorks.bullet1", "Looks for text that appears to be a title or heading"), t("auto-rename.tooltip.howItWorks.bullet1", "Looks for text that appears to be a title or heading"),
t("auto-rename.tooltip.howItWorks.bullet2", "Creates a clean, valid filename from the detected title"), t("auto-rename.tooltip.howItWorks.bullet2", "Creates a clean, valid filename from the detected title"),
@ -20,4 +19,4 @@ export const useAutoRenameTips = (): TooltipContent => {
} }
] ]
}; };
}; };

View File

@ -18,7 +18,7 @@ const AutoRename =(props: BaseToolProps) => {
); );
return createToolFlow({ return createToolFlow({
title: { title:t("auto-rename.title", "Auto Rename PDF"), tooltip: useAutoRenameTips()}, title: { title:t("auto-rename.title", "Auto Rename PDF"), description: t("auto-rename.description", "Auto Rename PDF"), tooltip: useAutoRenameTips()},
files: { files: {
selectedFiles: base.selectedFiles, selectedFiles: base.selectedFiles,
isCollapsed: base.hasResults, isCollapsed: base.hasResults,