Docker/flame
Docker/flame
1
0
Fork 0
mirror of https://github.com/pawelmalak/flame.git synced 2025-07-25 22:09:36 +02:00
Code Issues Releases Wiki Activity

Added ability to set icons on bookmarks. Added hover indicator for apps

Browse source
This commit is contained in:
unknown 2021-06-09 12:45:55 +02:00
parent 8b87ad92f1
commit 4583ca00e9
11 changed files with 80 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

36
client/src/components/Bookmarks/BookmarkForm/BookmarkForm.tsx
View file

@ -29,9 +29,11 @@ const BookmarkForm = (props: ComponentProps): JSX.Element => {
const [formData, setFormData] = useState<NewBookmark>({
name: '',
url: '',
categoryId: -1
categoryId: -1,
icon: ''
})
// Load category data if provided for editing
useEffect(() => {
if (props.category) {
setCategoryName({ name: props.category.name });
@ -40,18 +42,21 @@ const BookmarkForm = (props: ComponentProps): JSX.Element => {
}
}, [props.category])
// Load bookmark data if provided for editing
useEffect(() => {
if (props.bookmark) {
setFormData({
name: props.bookmark.name,
url: props.bookmark.url,
categoryId: props.bookmark.categoryId
categoryId: props.bookmark.categoryId,
icon: props.bookmark.icon
})
} else {
setFormData({
name: '',
url: '',
categoryId: -1
categoryId: -1,
icon: ''
})
}
}, [props.bookmark])
@ -79,7 +84,8 @@ const BookmarkForm = (props: ComponentProps): JSX.Element => {
setFormData({
name: '',
url: '',
categoryId: formData.categoryId
categoryId: formData.categoryId,
icon: ''
})
}
} else {
@ -94,7 +100,8 @@ const BookmarkForm = (props: ComponentProps): JSX.Element => {
setFormData({
name: '',
url: '',
categoryId: -1
categoryId: -1,
icon: ''
})
}
@ -201,6 +208,25 @@ const BookmarkForm = (props: ComponentProps): JSX.Element => {
})}
</select>
</InputGroup>
<InputGroup>
<label htmlFor='icon'>Bookmark Icon (optional)</label>
<input
type='text'
name='icon'
id='icon'
placeholder='book-open-outline'
value={formData.icon}
onChange={(e) => inputChangeHandler(e)}
/>
<span>
Use icon name from MDI.
<a
href='https://materialdesignicons.com/'
target='blank'>
{' '}Click here for reference
</a>
</span>
</InputGroup>
</Fragment>
)
}