diff --git a/apps/desktop/src/shared/ui/resource-list/preview-header.tsx b/apps/desktop/src/shared/ui/resource-list/preview-header.tsx index e3922fd1d9..d93f34b2d2 100644 --- a/apps/desktop/src/shared/ui/resource-list/preview-header.tsx +++ b/apps/desktop/src/shared/ui/resource-list/preview-header.tsx @@ -9,6 +9,8 @@ export function ResourcePreviewHeader({ category, targets, onClone, + actionLabel = "Clone", + actionIcon, children, }: { title: string; @@ -16,6 +18,8 @@ export function ResourcePreviewHeader({ category?: string | null; targets?: string[] | null; onClone: () => void; + actionLabel?: string; + actionIcon?: ReactNode; children?: ReactNode; }) { return ( @@ -30,8 +34,8 @@ export function ResourcePreviewHeader({ )} {category && ( diff --git a/apps/desktop/src/templates/components/details.tsx b/apps/desktop/src/templates/components/details.tsx index d7c6990537..f97186247e 100644 --- a/apps/desktop/src/templates/components/details.tsx +++ b/apps/desktop/src/templates/components/details.tsx @@ -1,3 +1,5 @@ +import { Pencil } from "lucide-react"; + import type { TemplateSection } from "@hypr/store"; import { SectionsList } from "./sections-editor"; @@ -77,6 +79,8 @@ function WebTemplatePreview({ description={template.description} category={template.category} targets={template.targets} + actionLabel="Edit" + actionIcon={} onClone={() => onClone({ title: template.title ?? "", diff --git a/apps/desktop/src/templates/index.tsx b/apps/desktop/src/templates/index.tsx index 217effac65..b3865979bf 100644 --- a/apps/desktop/src/templates/index.tsx +++ b/apps/desktop/src/templates/index.tsx @@ -109,7 +109,10 @@ function TemplateView({ tab }: { tab: Extract }) { description: string; sections: TemplateSection[]; }) => { - const id = createTemplate(template); + const id = createTemplate({ + ...template, + title: getTemplateCopyTitle(template.title), + }); if (id) { setSelectedMineId(id); } @@ -129,3 +132,12 @@ function TemplateView({ tab }: { tab: Extract }) { ); } + +function getTemplateCopyTitle(title: string) { + const value = title.trim(); + + if (!value) return "Untitled (Copy)"; + if (value.endsWith("(Copy)")) return value; + + return `${value} (Copy)`; +} diff --git a/apps/desktop/src/templates/sidebar-content.tsx b/apps/desktop/src/templates/sidebar-content.tsx index 3f620096db..ba816110df 100644 --- a/apps/desktop/src/templates/sidebar-content.tsx +++ b/apps/desktop/src/templates/sidebar-content.tsx @@ -247,20 +247,6 @@ export function TemplatesSidebarContent({
- {isWebLoading && ( -
- Provided by Char -
- {[0, 1, 2, 3].map((index) => ( -
-
-
-
- ))} -
-
- )} - {isEmpty ? (
@@ -272,12 +258,47 @@ export function TemplatesSidebarContent({ onClick={handleCreateTemplate} className="mt-3 text-sm text-neutral-600 underline hover:text-neutral-800" > - Create your first template + Create my first template )}
) : ( <> + {hasMineResults && ( +
+ My templates + {filteredMine.map((template) => ( + + ))} +
+ )} + + {isWebLoading && !hasWebResults && ( +
+ Provided by Char +
+ {[0, 1, 2, 3].map((index) => ( +
+
+
+
+ ))} +
+
+ )} + {hasWebResults && (
Provided by Char @@ -297,41 +318,13 @@ export function TemplatesSidebarContent({
{template.title || "Untitled"} - {template.category && ( - - ({template.category}) - - )}
- {template.description && ( -
- {template.description} -
- )}
))}
)} - - {hasMineResults && ( -
- Your templates - {filteredMine.map((template) => ( - - ))} -
- )} )}
@@ -395,11 +388,6 @@ function TemplateListItem({
{template.title?.trim() || "Untitled"}
- {template.description && ( -
- {template.description} -
- )}