diff options
Diffstat (limited to 'web/source/settings/admin/emoji/local/overview.js')
-rw-r--r-- | web/source/settings/admin/emoji/local/overview.js | 51 |
1 files changed, 24 insertions, 27 deletions
diff --git a/web/source/settings/admin/emoji/local/overview.js b/web/source/settings/admin/emoji/local/overview.js index ebfb89695..524cc928f 100644 --- a/web/source/settings/admin/emoji/local/overview.js +++ b/web/source/settings/admin/emoji/local/overview.js @@ -1,25 +1,25 @@ /* - GoToSocial - Copyright (C) 2021-2023 GoToSocial Authors admin@gotosocial.org + GoToSocial + Copyright (C) 2021-2023 GoToSocial Authors admin@gotosocial.org - 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 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. + 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/>. + 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/>. */ "use strict"; const React = require("react"); -const {Link} = require("wouter"); +const { Link } = require("wouter"); const NewEmojiForm = require("./new-emoji"); @@ -27,33 +27,31 @@ const query = require("../../../lib/query"); const { useEmojiByCategory } = require("../category-select"); const Loading = require("../../../components/loading"); -const base = "/settings/custom-emoji/local"; - -module.exports = function EmojiOverview() { +module.exports = function EmojiOverview({ baseUrl }) { const { data: emoji = [], isLoading, error - } = query.useGetAllEmojiQuery({filter: "domain:local"}); + } = query.useGetAllEmojiQuery({ filter: "domain:local" }); return ( <> <h1>Custom Emoji (local)</h1> - {error && + {error && <div className="error accent">{error}</div> } {isLoading - ? <Loading/> + ? <Loading /> : <> - <EmojiList emoji={emoji}/> - <NewEmojiForm emoji={emoji}/> + <EmojiList emoji={emoji} baseUrl={baseUrl} /> + <NewEmojiForm emoji={emoji} /> </> } </> ); }; -function EmojiList({emoji}) { +function EmojiList({ emoji, baseUrl }) { const emojiByCategory = useEmojiByCategory(emoji); return ( @@ -62,24 +60,23 @@ function EmojiList({emoji}) { <div className="list emoji-list"> {emoji.length == 0 && "No local emoji yet, add one below"} {Object.entries(emojiByCategory).map(([category, entries]) => { - return <EmojiCategory key={category} category={category} entries={entries}/>; + return <EmojiCategory key={category} category={category} entries={entries} baseUrl={baseUrl} />; })} </div> </div> ); } -function EmojiCategory({category, entries}) { +function EmojiCategory({ category, entries, baseUrl }) { return ( <div className="entry"> <b>{category}</b> <div className="emoji-group"> {entries.map((e) => { return ( - <Link key={e.id} to={`${base}/${e.id}`}> - {/* <Link key={e.static_url} to={`${base}`}> */} + <Link key={e.id} to={`${baseUrl}/${e.id}`}> <a> - <img src={e.url} alt={e.shortcode} title={`:${e.shortcode}:`}/> + <img src={e.url} alt={e.shortcode} title={`:${e.shortcode}:`} /> </a> </Link> ); |