diff options
author | 2024-04-24 12:12:47 +0200 | |
---|---|---|
committer | 2024-04-24 11:12:47 +0100 | |
commit | 7a1e6394831fb07e303c5ed0900dfe1ea4820de5 (patch) | |
tree | bcd526463b19a85fbe821dcad2276da401daec18 /web/source/settings/admin/emoji/remote/parse-from-toot.tsx | |
parent | [chore]: Bump codeberg.org/gruf/go-mutexes from 1.4.0 to 1.4.1 (#2860) (diff) | |
download | gotosocial-7a1e6394831fb07e303c5ed0900dfe1ea4820de5.tar.xz |
[chore] Refactor settings panel routing (and other fixes) (#2864)
Diffstat (limited to 'web/source/settings/admin/emoji/remote/parse-from-toot.tsx')
-rw-r--r-- | web/source/settings/admin/emoji/remote/parse-from-toot.tsx | 235 |
1 files changed, 0 insertions, 235 deletions
diff --git a/web/source/settings/admin/emoji/remote/parse-from-toot.tsx b/web/source/settings/admin/emoji/remote/parse-from-toot.tsx deleted file mode 100644 index df1c221ba..000000000 --- a/web/source/settings/admin/emoji/remote/parse-from-toot.tsx +++ /dev/null @@ -1,235 +0,0 @@ -/* - GoToSocial - Copyright (C) GoToSocial Authors admin@gotosocial.org - SPDX-License-Identifier: AGPL-3.0-or-later - - This program is free software: you can redistribute it and/or modify - it under the terms of the GNU Affero General Public License as published by - the Free Software Foundation, either version 3 of the License, or - (at your option) any later version. - - This program is distributed in the hope that it will be useful, - but WITHOUT ANY WARRANTY; without even the implied warranty of - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - GNU Affero General Public License for more details. - - You should have received a copy of the GNU Affero General Public License - along with this program. If not, see <http://www.gnu.org/licenses/>. -*/ - -import React, { useCallback, useEffect } from "react"; - -import { useTextInput, useComboBoxInput, useCheckListInput } from "../../../lib/form"; - -import useFormSubmit from "../../../lib/form/submit"; - -import CheckList from "../../../components/check-list"; -import { CategorySelect } from '../category-select'; - -import { TextInput } from "../../../components/form/inputs"; -import MutationButton from "../../../components/form/mutation-button"; -import { Error } from "../../../components/error"; -import { useSearchItemForEmojiMutation, usePatchRemoteEmojisMutation } from "../../../lib/query/admin/custom-emoji"; - -export default function ParseFromToot({ emojiCodes }) { - const [searchStatus, result] = useSearchItemForEmojiMutation(); - const urlField = useTextInput("url"); - - function submitSearch(e) { - e.preventDefault(); - if (urlField.value !== undefined && urlField.value.trim().length != 0) { - searchStatus(urlField.value); - } - } - - return ( - <div className="parse-emoji"> - <h2>Steal this look</h2> - <form onSubmit={submitSearch}> - <div className="form-field text"> - <label htmlFor="url"> - Link to a toot: - </label> - <div className="row"> - <input - type="text" - id="url" - name="url" - onChange={urlField.onChange} - value={urlField.value} - /> - <button disabled={result.isLoading}> - <i className={[ - "fa fa-fw", - (result.isLoading - ? "fa-refresh fa-spin" - : "fa-search") - ].join(" ")} aria-hidden="true" title="Search" /> - <span className="sr-only">Search</span> - </button> - </div> - </div> - </form> - <SearchResult result={result} localEmojiCodes={emojiCodes} /> - </div> - ); -} - -function SearchResult({ result, localEmojiCodes }) { - const { error, data, isSuccess, isError } = result; - - if (!(isSuccess || isError)) { - return null; - } - - if (error == "NONE_FOUND") { - return "No results found"; - } else if (error == "LOCAL_INSTANCE") { - return <b>This is a local user/toot, all referenced emoji are already on your instance</b>; - } else if (error != undefined) { - return <Error error={result.error} />; - } - - if (data.list.length == 0) { - return <b>This {data.type == "statuses" ? "toot" : "account"} doesn't use any custom emoji</b>; - } - - return ( - <CopyEmojiForm - localEmojiCodes={localEmojiCodes} - type={data.type} - emojiList={data.list} - /> - ); -} - -function CopyEmojiForm({ localEmojiCodes, type, emojiList }) { - const form = { - selectedEmoji: useCheckListInput("selectedEmoji", { - entries: emojiList, - uniqueKey: "id" - }), - category: useComboBoxInput("category") - }; - - const [formSubmit, result] = useFormSubmit( - form, - usePatchRemoteEmojisMutation(), - { - changedOnly: false, - onFinish: ({ data }) => { - if (data) { - // uncheck all successfully processed emoji - const processed = data.map((emoji) => { - return [emoji.id, { checked: false }]; - }); - form.selectedEmoji.updateMultiple(processed); - } - } - } - ); - - const buttonsInactive = form.selectedEmoji.someSelected - ? { - disabled: false, - title: "" - } - : { - disabled: true, - title: "No emoji selected, cannot perform any actions" - }; - - const checkListExtraProps = useCallback(() => ({ localEmojiCodes }), [localEmojiCodes]); - - return ( - <div className="parsed"> - <span>This {type == "statuses" ? "toot" : "account"} uses the following custom emoji, select the ones you want to copy/disable:</span> - <form onSubmit={formSubmit}> - <CheckList - field={form.selectedEmoji} - header={<></>} - EntryComponent={EmojiEntry} - getExtraProps={checkListExtraProps} - /> - - <CategorySelect - field={form.category} - children={[]} - /> - - <div className="action-buttons row"> - <MutationButton - name="copy" - label="Copy to local emoji" - result={result} - showError={false} - {...buttonsInactive} - /> - <MutationButton - name="disable" - label="Disable" - result={result} - className="button danger" - showError={false} - {...buttonsInactive} - /> - </div> - {result.error && ( - Array.isArray(result.error) - ? <ErrorList errors={result.error} /> - : <Error error={result.error} /> - )} - </form> - </div> - ); -} - -function ErrorList({ errors }) { - return ( - <div className="error"> - One or multiple emoji failed to process: - {errors.map(([shortcode, err]) => ( - <div key={shortcode}> - <b>{shortcode}:</b> {err} - </div> - ))} - </div> - ); -} - -function EmojiEntry({ entry: emoji, onChange, extraProps: { localEmojiCodes } }) { - const shortcodeField = useTextInput("shortcode", { - defaultValue: emoji.shortcode, - validator: function validateShortcode(code) { - return (emoji.checked && localEmojiCodes.has(code)) - ? "Shortcode already in use" - : ""; - } - }); - - useEffect(() => { - if (emoji.valid != shortcodeField.valid) { - onChange({ valid: shortcodeField.valid }); - } - }, [onChange, emoji.valid, shortcodeField.valid]); - - useEffect(() => { - shortcodeField.validate(); - // only need this update if it's the emoji.checked that updated, not shortcodeField - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [emoji.checked]); - - return ( - <> - <img className="emoji" src={emoji.url} title={emoji.shortcode} /> - - <TextInput - field={shortcodeField} - onChange={(e) => { - shortcodeField.onChange(e); - onChange({ shortcode: e.target.value, checked: true }); - }} - /> - </> - ); -}
\ No newline at end of file |