diff --git a/packages/app/src/components/quick-search/index.tsx b/packages/app/src/components/quick-search/index.tsx
index 15659e5558..65cfe22c6b 100644
--- a/packages/app/src/components/quick-search/index.tsx
+++ b/packages/app/src/components/quick-search/index.tsx
@@ -30,13 +30,19 @@ export const QuickSearch = ({ open, onClose }: TransitionsModalProps) => {
const [publishWorkspaceName, setPublishWorkspaceName] = useState('');
const [showCreatePage, setShowCreatePage] = useState(true);
const { triggerQuickSearchModal } = useModal();
-
+ const isPublicAndNoQuery = () => {
+ return isPublic && query.length === 0;
+ };
const handleClose = () => {
setQuery('');
onClose();
};
// Add ââ+Kâ shortcut keys as switches
useEffect(() => {
+ if (router.pathname.startsWith('/404')) {
+ triggerQuickSearchModal(false);
+ return;
+ }
const down = (e: KeyboardEvent) => {
if ((e.key === 'k' && e.metaKey) || (e.key === 'k' && e.ctrlKey)) {
const selection = window.getSelection();
@@ -53,7 +59,7 @@ export const QuickSearch = ({ open, onClose }: TransitionsModalProps) => {
document.addEventListener('keydown', down, { capture: true });
return () =>
document.removeEventListener('keydown', down, { capture: true });
- }, [open, triggerQuickSearchModal]);
+ }, [open, router.pathname, triggerQuickSearchModal]);
useEffect(() => {
if (router.pathname.startsWith('/public-workspace')) {
@@ -74,7 +80,7 @@ export const QuickSearch = ({ open, onClose }: TransitionsModalProps) => {
width={620}
style={{
maxHeight: '80vh',
- minHeight: '350px',
+ minHeight: isPublicAndNoQuery() ? '72px' : '350px',
top: '12vh',
}}
>
@@ -102,9 +108,13 @@ export const QuickSearch = ({ open, onClose }: TransitionsModalProps) => {
/>
{isMac() ? 'â + K' : 'Ctrl + K'}
-
+
-
+
{!isPublic ? (
{
setLoading={setLoading}
onClose={handleClose}
setPublishWorkspaceName={setPublishWorkspaceName}
+ data-testid="publishedSearchResults"
/>
)}
diff --git a/packages/app/src/components/quick-search/style.ts b/packages/app/src/components/quick-search/style.ts
index 492b7988c4..3c949aaaa9 100644
--- a/packages/app/src/components/quick-search/style.ts
+++ b/packages/app/src/components/quick-search/style.ts
@@ -9,6 +9,7 @@ export const StyledContent = styled('div')(({ theme }) => {
marginBottom: '10px',
...displayFlex('center', 'flex-start'),
color: theme.colors.popoverColor,
+ transition: 'all 0.15s',
letterSpacing: '0.06em',
'[cmdk-group-heading]': {
margin: '5px 16px',
@@ -16,7 +17,6 @@ export const StyledContent = styled('div')(({ theme }) => {
fontWeight: '500',
},
'[aria-selected="true"]': {
- transition: 'background .15s, color .15s',
borderRadius: '5px',
color: theme.colors.primaryColor,
backgroundColor: theme.colors.hoverBackground,
@@ -103,6 +103,7 @@ export const StyledModalDivider = styled('div')(({ theme }) => {
margin: '6px 16px 6.5px 16px',
position: 'relative',
borderTop: `0.5px solid ${theme.colors.placeHolderColor}`,
+ transition: 'all 0.15s',
};
});
diff --git a/tests/quick-search.spec.ts b/tests/quick-search.spec.ts
index 4526a7e447..68e05acd41 100644
--- a/tests/quick-search.spec.ts
+++ b/tests/quick-search.spec.ts
@@ -94,3 +94,23 @@ test.describe('Search and select', () => {
await assertTitleTexts(page, 'test123456', true);
});
});
+test.describe('Disable search on 404 page', () => {
+ test('Navigate to the 404 page and try to open quick search', async ({
+ page,
+ }) => {
+ await page.goto('http://localhost:8080/404');
+ const notFoundTip = page.locator('[data-testid=notFound]');
+ await expect(notFoundTip).toBeVisible();
+ await openQuickSearchByShortcut(page);
+ const quickSearch = page.locator('[data-testid=quickSearch]');
+ await expect(quickSearch).toBeVisible({ visible: false });
+ });
+});
+test.describe('Open quick search on the published page', () => {
+ test('Open quick search on local page', async ({ page }) => {
+ await newPage(page);
+ await openQuickSearchByShortcut(page);
+ const publishedSearchResults = page.locator('[publishedSearchResults]');
+ await expect(publishedSearchResults).toBeVisible({ visible: false });
+ });
+});