update(serverSearch) patches -> ServerList API (#11)

* feat(ServerListIndicator) add ids for css

* feat: consistency

* feat(SpotifyControls): dummy color control

* fix: resolve merge

* Revert "feat(SpotifyControls): dummy color control"

This reverts commit 3a38e02679.

* fix(ServerListIndicators): tooltip changes on mode

* fix(SpotifyControls): copy paste from source to sync

* fix: edit DiscordColorways to ServerListRenderPosition.Above

* Update index.tsx

* update(serverSearch): patches -> ServerList api

---------

Co-authored-by: thororen <78185467+thororen1234@users.noreply.github.com>
This commit is contained in:
pan 2024-07-17 21:57:14 +05:30 committed by GitHub
parent 5e26c8a436
commit f0aed6c3e2
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 62 additions and 29 deletions

View file

@ -4,14 +4,19 @@
* SPDX-License-Identifier: GPL-3.0-or-later
*/
import "./styles.css";
import { addServerListElement, removeServerListElement, ServerListRenderPosition } from "@api/ServerList";
import ErrorBoundary from "@components/ErrorBoundary";
import { EquicordDevs } from "@utils/constants";
import definePlugin from "@utils/types";
import { findByCodeLazy } from "@webpack";
import { Tooltip } from "webpack/common/components";
const openPopout = findByCodeLazy(".QUICKSWITCHER_OPENED,{");
function SearchIcon() {
return (
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24" id="vc-searchbutton-icon">
<path
fill="currentColor"
fill-rule="evenodd"
@ -25,35 +30,30 @@ export default definePlugin({
name: "ServerSearch",
authors: [EquicordDevs.camila314],
description: "Navigate your servers better with a quick search button",
patches: [
{
find: ".guildSeparator",
replacement: {
match: /return(\(0,.+?}\)}\))/,
replace: "return $self.insertSearch(() => $1)"
}
},
{
find: "__invalid_circleButtonMask",
replacement: {
match: /let (\i)=(\i)\.forwardRef/,
replace: "let $1 = $self.BigComponent = $2.forwardRef"
}
},
],
insertSearch(Elem) {
return (<>
<this.BigComponent
id="search-btn"
showPill={true}
tooltip="Search"
icon={() => <SearchIcon />}
onClick={() => openPopout("DM_SEARCH")}
search={true}
/>
renderButton() {
return <ErrorBoundary noop>
<div id="vc-searchbutton-container">
<Tooltip text="Search" position="right">
{({ onMouseEnter, onMouseLeave }) => (
<div
id="vc-searchbutton"
onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave}
onClick={() => openPopout("DM_SEARCH")}>
<SearchIcon />
</div>
)}
</Tooltip>
</div>
</ErrorBoundary>;
},
<Elem />
</>);
start() {
addServerListElement(ServerListRenderPosition.Above, this.renderButton);
},
stop() {
removeServerListElement(ServerListRenderPosition.Above, this.renderButton);
}
});

View file

@ -0,0 +1,33 @@
#vc-searchbutton-container {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 8px;
}
#vc-searchbutton {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: var(--background-secondary);
height: 48px;
width: 48px;
border-radius: 100%;
transition: border-radius 0.15s ease-out, background-color 0.15s ease-out;
}
#vc-searchbutton-icon {
color: var(--text-normal);
}
#vc-searchbutton:hover {
border-radius: 34%;
background-color: var(--green-360);
cursor: pointer;
}
#vc-searchbutton:hover #vc-searchbutton-icon {
color: var(--white-500);
}