UniqAI/bolt.diy
1
0
Fork 0
mirror of https://github.com/stackblitz-labs/bolt.diy synced 2025-06-26 18:26:38 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

feat(chat): add dynamic title support for bundled artifacts

Browse Source 
Introduce dynamic titles for bundled artifacts based on their state and ID. This improves user experience by providing more context during project creation or restoration. Also, pass the `title` parameter to the `getTemplates` function to customize the artifact title.
This commit is contained in:
KevIsDev 2025-04-29 14:37:17 +01:00
parent 902166efee
commit 3a894d0516
3 changed files with 19 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
app/components/chat/Artifact.tsx
View File

@ -64,6 +64,18 @@ export const Artifact = memo(({ messageId }: ArtifactProps) => {
}
}, [actions, artifact.type, allActionFinished]);
// Determine the dynamic title based on state for bundled artifacts
const dynamicTitle =
artifact?.type === 'bundled'
? allActionFinished
? artifact.id === 'restored-project-setup'
? 'Project Restored' // Title when restore is complete
: 'Project Created' // Title when initial creation is complete
: artifact.id === 'restored-project-setup'
? 'Restoring Project...' // Title during restore
: 'Creating Project...' // Title during initial creation
: artifact?.title; // Fallback to original title for non-bundled or if artifact is missing
return (
<>
<div className="artifact border border-bolt-elements-borderColor flex flex-col overflow-hidden rounded-lg w-full transition-border duration-150">
@ -77,7 +89,8 @@ export const Artifact = memo(({ messageId }: ArtifactProps) => {
>
<div className="px-5 p-3.5 w-full text-left">
<div className="w-full text-bolt-elements-textPrimary font-medium leading-5 text-sm">
{artifact?.title}
{/* Use the dynamic title here */}
{dynamicTitle}
</div>
<div className="w-full w-full text-bolt-elements-textSecondary text-xs mt-0.5">
Click to open Workbench
@ -112,6 +125,7 @@ export const Artifact = memo(({ messageId }: ArtifactProps) => {
)}
</div>
<div className="text-bolt-elements-textPrimary font-medium leading-5 text-sm">
{/* This status text remains the same */}
{allActionFinished
? artifact.id === 'restored-project-setup'
? 'Restore files from snapshot'

4
app/components/chat/Chat.client.tsx
View File

@ -316,14 +316,14 @@ export const ChatImpl = memo(
setFakeLoading(true);
if (autoSelectTemplate) {
const { template } = await selectStarterTemplate({
const { template, title } = await selectStarterTemplate({
message: messageContent,
model,
provider,
});
if (template !== 'blank') {
const temResp = await getTemplates(template).catch((e) => {
const temResp = await getTemplates(template, title).catch((e) => {
if (e.message.includes('rate limit')) {
toast.warning('Rate limit exceeded. Skipping starter template\n Continuing with blank template');
} else {

4
app/utils/selectStarterTemplate.ts
View File

@ -129,7 +129,7 @@ const getGitHubRepoContent = async (repoName: string): Promise<{ name: string; p
}
};
export async function getTemplates(templateName: string) {
export async function getTemplates(templateName: string, title?: string) {
const template = STARTER_TEMPLATES.find((t) => t.name == templateName);
if (!template) {
@ -183,7 +183,7 @@ export async function getTemplates(templateName: string) {
const assistantMessage = `
Bolt is initializing your project with the required files using the ${template.name} template.
<boltArtifact id="imported-files" title="Create initial files" type="bundled">
<boltArtifact id="imported-files" title="${title || 'Create initial files'}" type="bundled">
${filesToImport.files
.map(
(file) =>