Docker/flame
Docker/flame
1
0
Fork 0
mirror of https://github.com/pawelmalak/flame.git synced 2025-07-20 20:19:35 +02:00
Code Issues Releases Wiki Activity

Pin/Delete category

Browse source
This commit is contained in:
unknown 2021-05-25 14:05:53 +02:00
parent bd5354a2e3
commit 0f2125e720
8 changed files with 156 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

29
client/src/components/Bookmarks/BookmarkTable/BookmarkTable.tsx
View file

@ -1,5 +1,8 @@
import { ContentType } from '../Bookmarks';
import classes from './BookmarkTable.module.css';
import { connect } from 'react-redux';
import { pinCategory, deleteCategory } from '../../../store/actions';
import { KeyboardEvent } from 'react';
import Table from '../../UI/Table/Table';
import { Bookmark, Category } from '../../../interfaces';
@ -8,9 +11,25 @@ import Icon from '../../UI/Icons/Icon/Icon';
interface ComponentProps {
contentType: ContentType;
categories: Category[];
pinCategory: (category: Category) => void;
deleteCategory: (id: number) => void;
}
const BookmarkTable = (props: ComponentProps): JSX.Element => {
const deleteCategoryHandler = (category: Category): void => {
const proceed = window.confirm(`Are you sure you want to delete ${category.name}? It will delete ALL assigned bookmarks`);
if (proceed) {
props.deleteCategory(category.id);
}
}
const keyboardActionHandler = (e: KeyboardEvent, category: Category, handler: Function) => {
if (e.key === 'Enter') {
handler(category);
}
}
if (props.contentType === ContentType.category) {
return (
<Table headers={[
@ -24,8 +43,8 @@ const BookmarkTable = (props: ComponentProps): JSX.Element => {
<td className={classes.TableActions}>
<div
className={classes.TableAction}
// onClick={() => deleteAppHandler(app)}
// onKeyDown={(e) => keyboardActionHandler(e, app, deleteAppHandler)}
onClick={() => deleteCategoryHandler(category)}
onKeyDown={(e) => keyboardActionHandler(e, category, deleteCategoryHandler)}
tabIndex={0}>
<Icon icon='mdiDelete' />
</div>
@ -38,8 +57,8 @@ const BookmarkTable = (props: ComponentProps): JSX.Element => {
</div>
<div
className={classes.TableAction}
// onClick={() => props.pinApp(app)}
// onKeyDown={(e) => keyboardActionHandler(e, app, props.pinApp)}
onClick={() => props.pinCategory(category)}
onKeyDown={(e) => keyboardActionHandler(e, category, props.pinCategory)}
tabIndex={0}>
{category.isPinned
? <Icon icon='mdiPinOff' color='var(--color-accent)' />
@ -100,4 +119,4 @@ const BookmarkTable = (props: ComponentProps): JSX.Element => {
}
}
export default BookmarkTable;
export default connect(null, { pinCategory, deleteCategory })(BookmarkTable);