vndangkhoa/open-design
1
0
Fork 0
mirror of https://github.com/nexu-io/open-design.git synced 2026-06-01 03:14:35 +07:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

fix(web): keep picker hint clear of comments panel (#1820)

Browse source
This commit is contained in:
mehmet turac 2026-05-15 12:51:12 +03:00 committed by GitHub
parent fd80d7c997
commit 15ebe8b266
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 44 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
apps/web/src/components/FileViewer.tsx
View file

@ -6214,7 +6214,12 @@ function HtmlViewer({
&& openHintBox
&& !activeInspectTarget
&& !activeCommentTarget ? (
<div className="inspect-empty-hint-container">
<div
className={`inspect-empty-hint-container${
boardMode && !commentSidePanelCollapsed ? ' comment-side-panel-open' : ''
}`}
data-testid="inspect-empty-hint-container"
>
{liveCommentTargets.size === 0 ? (
<div
className="inspect-empty-hint"

14
apps/web/src/index.css
View file

@ -10721,6 +10721,20 @@ button.ghost.mcp-copy-btn:hover:not(:disabled) {
pointer-events: none;
}
.inspect-empty-hint-container.comment-side-panel-open {
right: 340px;
max-width: min(480px, calc(100% - 368px));
}
@media (max-width: 760px) {
.inspect-empty-hint-container.comment-side-panel-open {
left: 14px;
right: 14px;
top: 54px;
max-width: none;
}
}
.inspect-empty-hint-container button,
.inspect-empty-hint-container .close-button {
pointer-events: auto;

24
apps/web/tests/components/FileViewer.test.tsx
View file

@ -1176,6 +1176,30 @@ describe('FileViewer tweaks toolbar', () => {
expect(screen.queryByText('Already sent to Claude')).toBeNull();
});
it('keeps the picker hint clear of the open comment side panel', () => {
render(
<FileViewer
projectId="project-1"
projectKind="prototype"
file={htmlPreviewFile()}
liveHtml='<html><body><main data-od-id="hero">Hero</main></body></html>'
/>,
);
fireEvent.click(screen.getByTestId('board-mode-toggle'));
expect(screen.getByTestId('comment-side-panel')).toBeTruthy();
expect(screen.getByTestId('inspect-empty-hint-container').className).toContain(
'comment-side-panel-open',
);
fireEvent.click(screen.getByRole('button', { name: /hide comments/i }));
expect(screen.getByTestId('inspect-empty-hint-container').className).not.toContain(
'comment-side-panel-open',
);
});
it('does not preload non-open element comments into the picker composer', async () => {
const applyingElementComment: PreviewComment = {
id: 'comment-element-applying',