b9f6e3bd08
* Started adding locale translations :) * Added some more translations * Working on translating even more pages * More translations * Added test default locale retrieval * replace `intl.formatMessage` with custom `t` hook * add more translations * improve title syntax * add more translations * translate admin config page * translated error messages * add language selecter * minor fixes * improve language handling * add upcoming languages * add `crowdin.yml` * run formatter --------- Co-authored-by: Steve Tautonico <stautonico@gmail.com>
44 lines
1.3 KiB
TypeScript
44 lines
1.3 KiB
TypeScript
import { Box, FileInput, Group, Stack, Text, Title } from "@mantine/core";
|
|
import { useMediaQuery } from "@mantine/hooks";
|
|
import { Dispatch, SetStateAction } from "react";
|
|
import { TbUpload } from "react-icons/tb";
|
|
import { FormattedMessage } from "react-intl";
|
|
import useTranslate from "../../../hooks/useTranslate.hook";
|
|
|
|
const LogoConfigInput = ({
|
|
logo,
|
|
setLogo,
|
|
}: {
|
|
logo: File | null;
|
|
setLogo: Dispatch<SetStateAction<File | null>>;
|
|
}) => {
|
|
const isMobile = useMediaQuery("(max-width: 560px)");
|
|
const t = useTranslate();
|
|
|
|
return (
|
|
<Group position="apart">
|
|
<Stack style={{ maxWidth: isMobile ? "100%" : "40%" }} spacing={0}>
|
|
<Title order={6}>
|
|
<FormattedMessage id="admin.config.general.logo" />
|
|
</Title>
|
|
<Text color="dimmed" size="sm" mb="xs">
|
|
<FormattedMessage id="admin.config.general.logo.description" />
|
|
</Text>
|
|
</Stack>
|
|
<Stack></Stack>
|
|
<Box style={{ width: isMobile ? "100%" : "50%" }}>
|
|
<FileInput
|
|
clearable
|
|
icon={<TbUpload size={14} />}
|
|
value={logo}
|
|
onChange={(v) => setLogo(v)}
|
|
accept=".png"
|
|
placeholder={t("admin.config.general.logo.placeholder")}
|
|
/>
|
|
</Box>
|
|
</Group>
|
|
);
|
|
};
|
|
|
|
export default LogoConfigInput;
|