iBoss/bolt-diy
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

refactor(chat): move ScrollToBottom function outside BaseChat component

Browse Source 
Improve code maintainability by relocating the ScrollToBottom function outside the BaseChat component. This reduces complexity and enhances readability.
This commit is contained in:
KevIsDev
2025-04-28 11:10:51 +01:00
parent d5ced7e305
commit bf03b6f0fe
2 changed files with 17 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
app/components/chat/BaseChat.tsx
View File

@@ -217,22 +217,6 @@ export const BaseChat = React.forwardRef<HTMLDivElement, BaseChatProps>(
} }
}, [providerList, provider]); }, [providerList, provider]);
function ScrollToBottom() {
const { isAtBottom, scrollToBottom } = useStickToBottomContext();
return (
!isAtBottom && (
<button
className="absolute z-50 top-[50%] translate-y-[-60%] text-4xl rounded-lg left-[50%] translate-x-[-50%] px-1.5 py-0.5 flex items-center gap-2 bg-bolt-elements-background-depth-3 border border-bolt-elements-borderColor text-bolt-elements-textPrimary text-sm"
onClick={() => scrollToBottom()}
>
Go to last message
<span className="i-ph:arrow-down animate-bounce" />
</button>
)
);
}
const onApiKeysChange = async (providerName: string, apiKey: string) => { const onApiKeysChange = async (providerName: string, apiKey: string) => {
const newApiKeys = { ...apiKeys, [providerName]: apiKey }; const newApiKeys = { ...apiKeys, [providerName]: apiKey };
setApiKeys(newApiKeys); setApiKeys(newApiKeys);
@@ -695,3 +679,19 @@ export const BaseChat = React.forwardRef<HTMLDivElement, BaseChatProps>(
return <Tooltip.Provider delayDuration={200}>{baseChat}</Tooltip.Provider>; return <Tooltip.Provider delayDuration={200}>{baseChat}</Tooltip.Provider>;
}, },
); );
function ScrollToBottom() {
const { isAtBottom, scrollToBottom } = useStickToBottomContext();
return (
!isAtBottom && (
<button
className="absolute z-50 top-[50%] translate-y-[-60%] text-4xl rounded-lg left-[50%] translate-x-[-50%] px-1.5 py-0.5 flex items-center gap-2 bg-bolt-elements-background-depth-3 border border-bolt-elements-borderColor text-bolt-elements-textPrimary text-sm"
onClick={() => scrollToBottom()}
>
Go to last message
<span className="i-ph:arrow-down animate-bounce" />
</button>
)
);
}

5
app/lib/common/prompts/prompts.ts
View File

@@ -397,7 +397,7 @@ You are Bolt, an expert AI assistant and exceptional senior software developer w
- Use premium typography with refined hierarchy and spacing. - Use premium typography with refined hierarchy and spacing.
- Incorporate microbranding (custom icons, buttons, animations) aligned with the brand voice. - Incorporate microbranding (custom icons, buttons, animations) aligned with the brand voice.
- Use high-quality, optimized visual assets (photos, illustrations, icons). - Use high-quality, optimized visual assets (photos, illustrations, icons).
- Unless specified by the user, Bolt ALWAYS uses stock photos from Pexels where appropriate, only valid URLs you know exist. Bolt NEVER downloads the images and only links to them in image tags. - IMPORTANT: Unless specified by the user, Bolt ALWAYS uses stock photos from Pexels where appropriate, only valid URLs you know exist. Bolt NEVER downloads the images and only links to them in image tags.
Layout & Structure: Layout & Structure:
- Implement a systemized spacing/sizing system (e.g., 8pt grid, design tokens). - Implement a systemized spacing/sizing system (e.g., 8pt grid, design tokens).
@@ -492,9 +492,6 @@ ULTRA IMPORTANT: Think first and reply with the artifact that contains all neces
- Include all possible interactions (e.g., buttons, links, etc.) - Include all possible interactions (e.g., buttons, links, etc.)
- Include all possible navigation states (e.g., back, forward, etc.) - Include all possible navigation states (e.g., back, forward, etc.)
8. For photos:
- Unless specified by the user, Bolt ALWAYS uses stock photos from Pexels where appropriate, only valid URLs you know exist. Bolt NEVER downloads the images and only links to them in image tags.
EXPO CONFIGURATION: EXPO CONFIGURATION:
1. Define app configuration in app.json: 1. Define app configuration in app.json: