mirror of
https://github.com/revoltchat/revite.git
synced 2024-11-21 22:50:59 -05:00
Fix search scroll.
Add bot badge.
This commit is contained in:
parent
65d44c72bd
commit
8137409dae
5 changed files with 90 additions and 57 deletions
2
external/lang
vendored
2
external/lang
vendored
|
@ -1 +1 @@
|
|||
Subproject commit f20556de7648d4c600ef163b909d2f0141d25ded
|
||||
Subproject commit 7be90cf44ba08d235ae52d7dc6073d8f9347232b
|
|
@ -116,7 +116,7 @@
|
|||
"react-virtuoso": "^1.10.4",
|
||||
"redux": "^4.1.0",
|
||||
"revolt-api": "^0.5.2-alpha.0",
|
||||
"revolt.js": "5.0.0-alpha.21",
|
||||
"revolt.js": "5.0.1-alpha.0",
|
||||
"rimraf": "^3.0.2",
|
||||
"sass": "^1.35.1",
|
||||
"shade-blend-color": "^1.0.0",
|
||||
|
|
|
@ -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" />}
|
||||
|
|
|
@ -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>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -3605,10 +3605,10 @@ revolt-api@^0.5.2-alpha.0:
|
|||
resolved "https://registry.yarnpkg.com/revolt-api/-/revolt-api-0.5.2-alpha.0.tgz#a41f44ee38622636c9b5b5843f9e2798a79f00d3"
|
||||
integrity sha512-VI/o4nQTPXrDCVdFpZFfZfj7Q4nunj62gftdmYJtuSmXx+6eN2Nve7QQZjNt6UIH6Dc/IDgiFDcBdafBF9YXug==
|
||||
|
||||
revolt.js@5.0.0-alpha.21:
|
||||
version "5.0.0-alpha.21"
|
||||
resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-5.0.0-alpha.21.tgz#24e01dbcb2887dadcb480732a1b9b8f167c557b5"
|
||||
integrity sha512-UNRJRCyKoOFKULRYIWFZ3QN4th6s/sgMpQXtqaitVMtVBo6BJJvUT9wUM3WV08pN1acr3EPwnVre6sOtKM7khg==
|
||||
revolt.js@5.0.1-alpha.0:
|
||||
version "5.0.1-alpha.0"
|
||||
resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-5.0.1-alpha.0.tgz#3c79313ffe595ba5a4881692d5f3d2f5f6237bdb"
|
||||
integrity sha512-fdYQgYA/aSx7JZn7yAwqb/8hix+nI/AErt6oAkb412qAyTFxHD7LHeUWofRMJ+I0rAreQUYUwtC5FJH82S58pQ==
|
||||
dependencies:
|
||||
axios "^0.19.2"
|
||||
eventemitter3 "^4.0.7"
|
||||
|
|
Loading…
Reference in a new issue