abner/for-legacy-web
1
0
Fork 1
mirror of https://github.com/stoatchat/for-legacy-web.git synced 2026-03-06 17:11:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix search scroll.

Browse Source 
Add bot badge.
This commit is contained in:
Paul
2021-08-12 12:16:24 +01:00
parent 65d44c72bd
commit 8137409dae
5 changed files with 90 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/components/common/user/UserShort.tsx
View File

@@ -1,6 +1,7 @@
import { observer } from "mobx-react-lite";
import { useParams } from "react-router-dom";
import { User } from "revolt.js/dist/maps/Users";
import styled from "styled-components";
import { Text } from "preact-i18n";
@@ -9,6 +10,21 @@ import { useClient } from "../../../context/revoltjs/RevoltClient";
import UserIcon from "./UserIcon";
const BotBadge = styled.div`
display: inline-block;
height: 1.4em;
padding: 0 4px;
font-size: 0.6em;
user-select: none;
margin-inline-start: 2px;
text-transform: uppercase;
color: var(--foreground);
background: var(--accent);
border-radius: calc(var(--border-radius) / 2);
`;
export const Username = observer(
({
user,
@@ -51,6 +67,21 @@ export const Username = observer(
}
}
if (user?.bot) {
return (
<>
<span {...otherProps} style={{ color }}>
{username ?? (
<Text id="app.main.channel.unknown_user" />
)}
</span>
<BotBadge>
<Text id="app.main.channel.bot" />
</BotBadge>
</>
);
}
return (
<span {...otherProps} style={{ color }}>
{username ?? <Text id="app.main.channel.unknown_user" />}

104
src/components/navigation/right/Search.tsx
View File

@@ -13,7 +13,7 @@ import InputBox from "../../ui/InputBox";
import Overline from "../../ui/Overline";
import Preloader from "../../ui/Preloader";
import { GenericSidebarBase } from "../SidebarBase";
import { GenericSidebarBase, GenericSidebarList } from "../SidebarBase";
type SearchState =
| {
@@ -100,57 +100,59 @@ export function SearchSidebar({ close }: Props) {
return (
<GenericSidebarBase>
<SearchBase>
<Overline type="error" onClick={close} block>
« back to members
</Overline>
<Overline type="subtle" block>
<Text id="app.main.channel.search.title" />
</Overline>
<InputBox
value={query}
onKeyDown={(e) => e.key === "Enter" && search()}
onChange={(e) => setQuery(e.currentTarget.value)}
/>
<div class="sort">
{["Latest", "Oldest", "Relevance"].map((key) => (
<Button
key={key}
compact
error={sort === key}
onClick={() => setSort(key as Sort)}>
<Text
id={`app.main.channel.search.sort.${key.toLowerCase()}`}
/>
</Button>
))}
</div>
{state.type === "loading" && <Preloader type="ring" />}
{state.type === "results" && (
<div class="list">
{state.results.map((message) => {
let href = "";
if (channel?.channel_type === "TextChannel") {
href += `/server/${channel.server_id}`;
}
href += `/channel/${message.channel_id}/${message._id}`;
return (
<Link to={href} key={message._id}>
<div class="message">
<Message
message={message}
head
hideReply
/>
</div>
</Link>
);
})}
<GenericSidebarList>
<SearchBase>
<Overline type="error" onClick={close} block>
« back to members
</Overline>
<Overline type="subtle" block>
<Text id="app.main.channel.search.title" />
</Overline>
<InputBox
value={query}
onKeyDown={(e) => e.key === "Enter" && search()}
onChange={(e) => setQuery(e.currentTarget.value)}
/>
<div class="sort">
{["Latest", "Oldest", "Relevance"].map((key) => (
<Button
key={key}
compact
error={sort === key}
onClick={() => setSort(key as Sort)}>
<Text
id={`app.main.channel.search.sort.${key.toLowerCase()}`}
/>
</Button>
))}
</div>
)}
</SearchBase>
{state.type === "loading" && <Preloader type="ring" />}
{state.type === "results" && (
<div class="list">
{state.results.map((message) => {
let href = "";
if (channel?.channel_type === "TextChannel") {
href += `/server/${channel.server_id}`;
}
href += `/channel/${message.channel_id}/${message._id}`;
return (
<Link to={href} key={message._id}>
<div class="message">
<Message
message={message}
head
hideReply
/>
</div>
</Link>
);
})}
</div>
)}
</SearchBase>
</GenericSidebarList>
</GenericSidebarBase>
);
}