mirror of https://github.com/vector-im/riot-web
Merge pull request #6899 from KalleStruik/19245-improve-styling-of-search-initialization-errors
Improve the styling of search initialization errors.pull/28788/head^2
Travis Ralston
GitHub
commit
ed2ee70f9f
|
|
@ -143,7 +143,7 @@
|
|||
@import "./views/elements/_AddressSelector.scss";
|
||||
@import "./views/elements/_AddressTile.scss";
|
||||
@import "./views/elements/_CopyableText.scss";
|
||||
@import "./views/elements/_DesktopBuildsNotice.scss";
|
||||
@import "./views/elements/_SearchWarning.scss";
|
||||
@import "./views/elements/_DesktopCapturerSourcePicker.scss";
|
||||
@import "./views/elements/_DialPadBackspaceButton.scss";
|
||||
@import "./views/elements/_DirectorySearchBox.scss";
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
*/
|
||||
|
||||
.mx_DesktopBuildsNotice {
|
||||
.mx_SearchWarning {
|
||||
text-align: center;
|
||||
padding: 0 16px;
|
||||
|
||||
|
|
@ -27,7 +27,7 @@ import { logger } from "matrix-js-sdk/src/logger";
|
|||
import { MatrixClientPeg } from '../../MatrixClientPeg';
|
||||
import EventIndexPeg from "../../indexing/EventIndexPeg";
|
||||
import { _t } from '../../languageHandler';
|
||||
import DesktopBuildsNotice, { WarningKind } from "../views/elements/DesktopBuildsNotice";
|
||||
import SearchWarning, { WarningKind } from "../views/elements/SearchWarning";
|
||||
import BaseCard from "../views/right_panel/BaseCard";
|
||||
import ResizeNotifier from '../../utils/ResizeNotifier';
|
||||
import TimelinePanel from "./TimelinePanel";
|
||||
|
|
@ -275,7 +275,7 @@ class FilePanel extends React.Component<IProps, IState> {
|
|||
sensor={this.card.current}
|
||||
onMeasurement={this.onMeasurement}
|
||||
/>
|
||||
<DesktopBuildsNotice isRoomEncrypted={isRoomEncrypted} kind={WarningKind.Files} />
|
||||
<SearchWarning isRoomEncrypted={isRoomEncrypted} kind={WarningKind.Files} />
|
||||
<TimelinePanel
|
||||
manageReadReceipts={false}
|
||||
manageReadMarkers={false}
|
||||
|
|
|
|||
|
|
@ -35,28 +35,30 @@ interface IProps {
|
|||
kind: WarningKind;
|
||||
}
|
||||
|
||||
export default function DesktopBuildsNotice({ isRoomEncrypted, kind }: IProps) {
|
||||
export default function SearchWarning({ isRoomEncrypted, kind }: IProps) {
|
||||
if (!isRoomEncrypted) return null;
|
||||
if (EventIndexPeg.get()) return null;
|
||||
|
||||
if (EventIndexPeg.error) {
|
||||
return <>
|
||||
{ _t("Message search initialisation failed, check <a>your settings</a> for more information", {}, {
|
||||
a: sub => (
|
||||
<AccessibleButton
|
||||
kind="link_inline"
|
||||
onClick={(evt) => {
|
||||
evt.preventDefault();
|
||||
dis.dispatch({
|
||||
action: Action.ViewUserSettings,
|
||||
initialTabId: UserTab.Security,
|
||||
});
|
||||
}}
|
||||
>
|
||||
{ sub }
|
||||
</AccessibleButton>),
|
||||
}) }
|
||||
</>;
|
||||
return (
|
||||
<div className="mx_SearchWarning">
|
||||
{ _t("Message search initialisation failed, check <a>your settings</a> for more information", {}, {
|
||||
a: sub => (
|
||||
<AccessibleButton
|
||||
kind="link_inline"
|
||||
onClick={(evt) => {
|
||||
evt.preventDefault();
|
||||
dis.dispatch({
|
||||
action: Action.ViewUserSettings,
|
||||
initialTabId: UserTab.Security,
|
||||
});
|
||||
}}
|
||||
>
|
||||
{ sub }
|
||||
</AccessibleButton>),
|
||||
}) }
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const brand = SdkConfig.get("brand");
|
||||
|
|
@ -97,7 +99,7 @@ export default function DesktopBuildsNotice({ isRoomEncrypted, kind }: IProps) {
|
|||
}
|
||||
|
||||
return (
|
||||
<div className="mx_DesktopBuildsNotice">
|
||||
<div className="mx_SearchWarning">
|
||||
{ logo }
|
||||
<span>{ text }</span>
|
||||
</div>
|
||||
|
|
@ -20,10 +20,10 @@ import classNames from "classnames";
|
|||
|
||||
import AccessibleButton from "../elements/AccessibleButton";
|
||||
import { _t } from '../../../languageHandler';
|
||||
import DesktopBuildsNotice, { WarningKind } from "../elements/DesktopBuildsNotice";
|
||||
import { PosthogScreenTracker } from '../../../PosthogTrackers';
|
||||
import { getKeyBindingsManager } from "../../../KeyBindingsManager";
|
||||
import { KeyBindingAction } from "../../../accessibility/KeyboardShortcuts";
|
||||
import SearchWarning, { WarningKind } from "../elements/SearchWarning";
|
||||
|
||||
interface IProps {
|
||||
onCancelClick: () => void;
|
||||
|
|
@ -127,7 +127,7 @@ export default class SearchBar extends React.Component<IProps, IState> {
|
|||
</div>
|
||||
<AccessibleButton className="mx_SearchBar_cancel" onClick={this.props.onCancelClick} />
|
||||
</div>
|
||||
<DesktopBuildsNotice isRoomEncrypted={this.props.isRoomEncrypted} kind={WarningKind.Search} />
|
||||
<SearchWarning isRoomEncrypted={this.props.isRoomEncrypted} kind={WarningKind.Search} />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2249,11 +2249,6 @@
|
|||
"Error - Mixed content": "Error - Mixed content",
|
||||
"Popout widget": "Popout widget",
|
||||
"Copy": "Copy",
|
||||
"Message search initialisation failed, check <a>your settings</a> for more information": "Message search initialisation failed, check <a>your settings</a> for more information",
|
||||
"Use the <a>Desktop app</a> to see all encrypted files": "Use the <a>Desktop app</a> to see all encrypted files",
|
||||
"Use the <a>Desktop app</a> to search encrypted messages": "Use the <a>Desktop app</a> to search encrypted messages",
|
||||
"This version of %(brand)s does not support viewing some encrypted files": "This version of %(brand)s does not support viewing some encrypted files",
|
||||
"This version of %(brand)s does not support searching encrypted messages": "This version of %(brand)s does not support searching encrypted messages",
|
||||
"Share entire screen": "Share entire screen",
|
||||
"Application window": "Application window",
|
||||
"Share content": "Share content",
|
||||
|
|
@ -2380,6 +2375,11 @@
|
|||
"%(count)s members including %(commaSeparatedMembers)s|one": "%(commaSeparatedMembers)s",
|
||||
"%(count)s people you know have already joined|other": "%(count)s people you know have already joined",
|
||||
"%(count)s people you know have already joined|one": "%(count)s person you know has already joined",
|
||||
"Message search initialisation failed, check <a>your settings</a> for more information": "Message search initialisation failed, check <a>your settings</a> for more information",
|
||||
"Use the <a>Desktop app</a> to see all encrypted files": "Use the <a>Desktop app</a> to see all encrypted files",
|
||||
"Use the <a>Desktop app</a> to search encrypted messages": "Use the <a>Desktop app</a> to search encrypted messages",
|
||||
"This version of %(brand)s does not support viewing some encrypted files": "This version of %(brand)s does not support viewing some encrypted files",
|
||||
"This version of %(brand)s does not support searching encrypted messages": "This version of %(brand)s does not support searching encrypted messages",
|
||||
"Server Options": "Server Options",
|
||||
"You can use the custom server options to sign into other Matrix servers by specifying a different homeserver URL. This allows you to use %(brand)s with an existing Matrix account on a different homeserver.": "You can use the custom server options to sign into other Matrix servers by specifying a different homeserver URL. This allows you to use %(brand)s with an existing Matrix account on a different homeserver.",
|
||||
"Join millions for free on the largest public server": "Join millions for free on the largest public server",
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ limitations under the License.
|
|||
import React from 'react';
|
||||
import { mount } from "enzyme";
|
||||
|
||||
import DesktopBuildsNotice from "../../../../src/components/views/elements/DesktopBuildsNotice";
|
||||
import SearchWarning from "../../../../src/components/views/elements/SearchWarning";
|
||||
import { PosthogScreenTracker } from "../../../../src/PosthogTrackers";
|
||||
import SearchBar, { SearchScope } from "../../../../src/components/views/rooms/SearchBar";
|
||||
import { KeyBindingAction } from "../../../../src/accessibility/KeyboardShortcuts";
|
||||
|
|
@ -39,8 +39,8 @@ jest.mock("../../../../src/KeyBindingsManager", () => ({
|
|||
{ getAccessibilityAction: jest.fn(() => mockCurrentEvent) })),
|
||||
}));
|
||||
|
||||
/** mock out DesktopBuildsNotice component so it doesn't affect the result of our test */
|
||||
jest.mock('../../../../src/components/views/elements/DesktopBuildsNotice', () => ({
|
||||
/** mock out SearchWarning component so it doesn't affect the result of our test */
|
||||
jest.mock('../../../../src/components/views/elements/SearchWarning', () => ({
|
||||
__esModule: true,
|
||||
WarningKind: {
|
||||
get Search() { // eslint-disable-line @typescript-eslint/naming-convention
|
||||
|
|
@ -73,13 +73,13 @@ describe("SearchBar", () => {
|
|||
|
||||
it("must render child components and pass necessary props", () => {
|
||||
const postHogScreenTracker = wrapper.find(PosthogScreenTracker);
|
||||
const desktopBuildNotice = wrapper.find(DesktopBuildsNotice);
|
||||
const searchWarning = wrapper.find(SearchWarning);
|
||||
|
||||
expect(postHogScreenTracker.length).toBe(1);
|
||||
expect(desktopBuildNotice.length).toBe(1);
|
||||
expect(searchWarning.length).toBe(1);
|
||||
expect(postHogScreenTracker.props().screenName).toEqual("RoomSearch");
|
||||
expect(desktopBuildNotice.props().isRoomEncrypted).toEqual(searchProps.isRoomEncrypted);
|
||||
expect(desktopBuildNotice.props().kind).toEqual(mockWarningKind);
|
||||
expect(searchWarning.props().isRoomEncrypted).toEqual(searchProps.isRoomEncrypted);
|
||||
expect(searchWarning.props().kind).toEqual(mockWarningKind);
|
||||
});
|
||||
|
||||
it("must not search when input value is empty", () => {
|
||||
|
|
|
|||
Loading…
Reference in New Issue