Docker/flame
Docker/flame
1
0
Fork 0
mirror of https://github.com/pawelmalak/flame.git synced 2025-07-27 14:59:37 +02:00
Code Issues Releases Wiki Activity

Add custom icons to bookmarks (#5)

Browse source 
* allow custom icons for bookmarks

* update docker-image action to tag images based on source branch
This commit is contained in:
François Darveau 2021-06-27 15:17:23 -04:00 • committed by François Darveau
parent 28ea50676a
commit c0d3ea2c4a
8 changed files with 77 additions and 91 deletions
Download patch file Download diff file Expand all files Collapse all files

20
client/src/components/Apps/AppForm/AppForm.tsx
View file

@ -30,7 +30,7 @@ interface ComponentProps {
}
const AppForm = (props: ComponentProps): JSX.Element => {
const [useCustomIcon, toggleUseCustomIcon] = useState<boolean>(false);
const [useCustomIcon, setUseCustomIcon] = useState<boolean>(false);
const [customIcon, setCustomIcon] = useState<File | null>(null);
const [categoryData, setCategoryData] = useState<NewCategory>({
name: '',
@ -77,13 +77,12 @@ const AppForm = (props: ComponentProps): JSX.Element => {
const createFormData = (): FormData => {
const data = new FormData();
Object.entries(appData).forEach((entry: [string, any]) => {
data.append(entry[0], entry[1]);
});
if (customIcon) {
data.append('icon', customIcon);
}
data.append('name', appData.name);
data.append('url', appData.url);
data.append('categoryId', appData.categoryId.toString());
return data;
};
@ -150,6 +149,11 @@ const AppForm = (props: ComponentProps): JSX.Element => {
[e.target.name]: e.target.value
})
}
const toggleUseCustomIcon = (): void => {
setUseCustomIcon(!useCustomIcon);
setCustomIcon(null);
};
const fileChangeHandler = (e: ChangeEvent<HTMLInputElement>): void => {
if (e.target.files) {
@ -272,7 +276,7 @@ const AppForm = (props: ComponentProps): JSX.Element => {
</a>
</span>
<span
onClick={() => toggleUseCustomIcon(!useCustomIcon)}
onClick={() => toggleUseCustomIcon()}
className={classes.Switch}>
Switch to custom icon upload
</span>
@ -286,10 +290,10 @@ const AppForm = (props: ComponentProps): JSX.Element => {
id='icon'
required
onChange={(e) => fileChangeHandler(e)}
accept=".jpg,.jpeg,.png,.svg"
accept='.jpg,.jpeg,.png,.svg'
/>
<span
onClick={() => toggleUseCustomIcon(!useCustomIcon)}
onClick={() => toggleUseCustomIcon()}
className={classes.Switch}>
Switch to MDI
</span>