From 16277d1074b5c70afc88c5d1e15e243f96f238a0 Mon Sep 17 00:00:00 2001 From: Tom Moor Date: Thu, 27 Jan 2022 07:29:59 -0800 Subject: [PATCH] fix: Document search results in editor now show full path closes #3007 --- app/editor/components/LinkEditor.tsx | 9 +++++---- app/editor/components/LinkSearchResult.tsx | 10 ++++------ app/scenes/Document/components/DataLoader.tsx | 3 ++- 3 files changed, 11 insertions(+), 11 deletions(-) diff --git a/app/editor/components/LinkEditor.tsx b/app/editor/components/LinkEditor.tsx index d2b767b13..9f3f2fb3a 100644 --- a/app/editor/components/LinkEditor.tsx +++ b/app/editor/components/LinkEditor.tsx @@ -337,7 +337,7 @@ class LinkEditor extends React.Component { title={result.title} subtitle={result.subtitle} icon={} - onMouseOver={() => this.handleFocusLink(index)} + onPointerMove={() => this.handleFocusLink(index)} onClick={this.handleSelectLink(result.url, result.title)} selected={index === selectedIndex} /> @@ -349,7 +349,7 @@ class LinkEditor extends React.Component { title={suggestedLinkTitle} subtitle={dictionary.createNewDoc} icon={} - onMouseOver={() => this.handleFocusLink(results.length)} + onPointerMove={() => this.handleFocusLink(results.length)} onClick={() => { this.handleCreateLink(suggestedLinkTitle); @@ -382,13 +382,14 @@ const SearchResults = styled.ol` width: 100%; height: auto; left: 0; - padding: 4px 8px 8px; + padding: 0; margin: 0; margin-top: -3px; margin-bottom: 0; border-radius: 0 0 4px 4px; overflow-y: auto; - max-height: 25vh; + overscroll-behavior: none; + max-height: 260px; @media (hover: none) and (pointer: coarse) { position: fixed; diff --git a/app/editor/components/LinkSearchResult.tsx b/app/editor/components/LinkSearchResult.tsx index d1ee20074..04e10724f 100644 --- a/app/editor/components/LinkSearchResult.tsx +++ b/app/editor/components/LinkSearchResult.tsx @@ -2,13 +2,11 @@ import * as React from "react"; import scrollIntoView from "smooth-scroll-into-view-if-needed"; import styled from "styled-components"; -type Props = { - onClick: (event: React.MouseEvent) => void; - onMouseOver: (event: React.MouseEvent) => void; +type Props = React.HTMLAttributes & { icon: React.ReactNode; selected: boolean; - title: string; - subtitle?: string; + title: React.ReactNode; + subtitle?: React.ReactNode; }; function LinkSearchResult({ title, subtitle, selected, icon, ...rest }: Props) { @@ -55,7 +53,7 @@ const ListItem = styled.li<{ display: flex; align-items: center; padding: 8px; - border-radius: 2px; + border-radius: 4px; color: ${(props) => props.theme.toolbarItem}; background: ${(props) => props.selected ? props.theme.toolbarHoverBackground : "transparent"}; diff --git a/app/scenes/Document/components/DataLoader.tsx b/app/scenes/Document/components/DataLoader.tsx index 86e8d596b..672e2eafd 100644 --- a/app/scenes/Document/components/DataLoader.tsx +++ b/app/scenes/Document/components/DataLoader.tsx @@ -11,6 +11,7 @@ import Document from "~/models/Document"; import Revision from "~/models/Revision"; import Error404 from "~/scenes/Error404"; import ErrorOffline from "~/scenes/ErrorOffline"; +import DocumentBreadcrumb from "~/components/DocumentBreadcrumb"; import withStores from "~/components/withStores"; import { NavigationNode } from "~/types"; import { NotFoundError, OfflineError } from "~/utils/errors"; @@ -138,7 +139,7 @@ class DataLoader extends React.Component { return { title: document.title, - subtitle: `Updated ${time}`, + subtitle: , url: document.url, }; }),