Implement empty design list (#7115)

This commit is contained in:
Germain 2021-11-11 13:56:44 +00:00 committed by GitHub
parent 9abb2f5ff4
commit e2b59335cf
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 89 additions and 1 deletions

View file

@ -180,6 +180,30 @@ export const ThreadPanelHeader = ({ filterOption, setFilterOption }: {
</div>;
};
interface EmptyThreadIProps {
filterOption: ThreadFilterType;
showAllThreadsCallback: () => void;
}
const EmptyThread: React.FC<EmptyThreadIProps> = ({ filterOption, showAllThreadsCallback }) => {
return <aside className="mx_ThreadPanel_empty">
<div className="mx_ThreadPanel_largeIcon" />
<h2>{ _t("Keep discussions organised with threads") }</h2>
<p>{ _t("Threads help you keep conversations on-topic and easily"
+ "track them over time. Create the first one by using the"
+ "\"Reply in thread\" button on a message.") }
</p>
<p>
{ /* Always display that paragraph to prevent layout shift
When hiding the button */ }
{ filterOption === ThreadFilterType.My
? <button onClick={showAllThreadsCallback}>{ _t("Show all threads") }</button>
: <>&nbsp;</>
}
</p>
</aside>;
};
const ThreadPanel: React.FC<IProps> = ({ roomId, onClose, permalinkCreator }) => {
const mxClient = useContext(MatrixClientContext);
const roomContext = useContext(RoomContext);
@ -216,7 +240,10 @@ const ThreadPanel: React.FC<IProps> = ({ roomId, onClose, permalinkCreator }) =>
sendReadReceiptOnLoad={false} // No RR support in thread's MVP
timelineSet={filteredTimelineSet}
showUrlPreview={true}
empty={<div>empty</div>}
empty={<EmptyThread
filterOption={filterOption}
showAllThreadsCallback={() => setFilterOption(ThreadFilterType.All)}
/>}
alwaysShowTimestamps={true}
layout={Layout.Group}
hideThreadedMessages={false}

View file

@ -3023,6 +3023,9 @@
"All threads": "All threads",
"Shows all threads from current room": "Shows all threads from current room",
"Show:": "Show:",
"Keep discussions organised with threads": "Keep discussions organised with threads",
"Threads help you keep conversations on-topic and easilytrack them over time. Create the first one by using the\"Reply in thread\" button on a message.": "Threads help you keep conversations on-topic and easilytrack them over time. Create the first one by using the\"Reply in thread\" button on a message.",
"Show all threads": "Show all threads",
"Thread": "Thread",
"Tried to load a specific point in this room's timeline, but you do not have permission to view the message in question.": "Tried to load a specific point in this room's timeline, but you do not have permission to view the message in question.",
"Tried to load a specific point in this room's timeline, but was unable to find it.": "Tried to load a specific point in this room's timeline, but was unable to find it.",