Skip to content

Commit

Permalink
feat: enable delete feedback based on user permissions (#2)
Browse files Browse the repository at this point in the history 
* feat: enable delete feedback based on BE info

* fix: linters

---------

Co-authored-by: Piero Nicolli <piero.nicolli@redturtle.it>
  • Loading branch information
@giuliaghisini @pnicolli
giuliaghisini and pnicolli authored Mar 4, 2024
1 parent 9c36693 commit ece04e8
Show file tree
Hide file tree
Showing 2 changed files with 81 additions and 65 deletions.
112 changes: 63 additions & 49 deletions src/components/manage/VFPanel/VFPanel.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -158,6 +158,11 @@ const VFPanel = ({ moment: Moment, toastify }) => {
}, [searchableText]);

const feedbacks = useSelector((state) => state.getFeedbacks);
const can_delete_feedbacks = useSelector(
(state) =>
state.getFeedbacks.result?.actions?.can_delete_feedbacks ?? false,
);

const isUnauthorized = useMemo(
() => feedbacks?.error && feedbacks?.error?.status === 401,
// eslint-disable-next-line react-hooks/exhaustive-deps
Expand Down Expand Up @@ -251,7 +256,10 @@ const VFPanel = ({ moment: Moment, toastify }) => {
{intl.formatMessage(messages.feedbacks_controlpanel)}
</Segment>

<VFPanelMenu doSearch={doSearch} />
<VFPanelMenu
doSearch={doSearch}
can_delete_feedbacks={can_delete_feedbacks}
/>

<Segment>
{itemsSelected.length > 0 && (
Expand All @@ -261,13 +269,15 @@ const VFPanel = ({ moment: Moment, toastify }) => {
{intl.formatMessage(messages.items_selected)}
</div>
<div className="actions">
<Button
type="button"
color="red"
onClick={() => setShowConfirmDelete(true)}
>
{intl.formatMessage(messages.reset_feedbacks)}
</Button>
{can_delete_feedbacks && (
<Button
type="button"
color="red"
onClick={() => setShowConfirmDelete(true)}
>
{intl.formatMessage(messages.reset_feedbacks)}
</Button>
)}
</div>
</Message>
)}
Expand All @@ -293,27 +303,29 @@ const VFPanel = ({ moment: Moment, toastify }) => {
>
<Table.Header>
<Table.Row>
<Table.HeaderCell
width={1}
textAlign="center"
verticalAlign="middle"
>
<Checkbox
title={intl.formatMessage(messages.select_all)}
checked={
feedbacks?.result?.items?.length !== 0 &&
itemsSelected?.length ===
feedbacks?.result?.items?.length
}
onChange={(e, o) => {
if (o.checked) {
setItemsSelected(feedbacks?.result?.items);
} else {
setItemsSelected([]);
{can_delete_feedbacks && (
<Table.HeaderCell
width={1}
textAlign="center"
verticalAlign="middle"
>
<Checkbox
title={intl.formatMessage(messages.select_all)}
checked={
feedbacks?.result?.items?.length !== 0 &&
itemsSelected?.length ===
feedbacks?.result?.items?.length
}
}}
/>
</Table.HeaderCell>
onChange={(e, o) => {
if (o.checked) {
setItemsSelected(feedbacks?.result?.items);
} else {
setItemsSelected([]);
}
}}
/>
</Table.HeaderCell>
)}
<Table.HeaderCell
sorted={
sort_on === 'title' ? fixSemanticOrdering() : null
Expand Down Expand Up @@ -427,27 +439,29 @@ const VFPanel = ({ moment: Moment, toastify }) => {
{feedbacks?.loaded &&
feedbacks.result?.items?.map((item) => (
<tr key={item.uid}>
<Table.Cell textAlign="center">
<Checkbox
title={intl.formatMessage(messages.select_item)}
checked={itemsSelected.some(
(is) => is.url === item.url,
)}
onChange={(e, o) => {
if (o.checked) {
let s = [...itemsSelected];
s.push(item);
setItemsSelected(s);
} else {
setItemsSelected(
itemsSelected.filter(
(i) => i.url !== item.url,
),
);
}
}}
/>
</Table.Cell>
{can_delete_feedbacks && (
<Table.Cell textAlign="center">
<Checkbox
title={intl.formatMessage(messages.select_item)}
checked={itemsSelected.some(
(is) => is.url === item.url,
)}
onChange={(e, o) => {
if (o.checked) {
let s = [...itemsSelected];
s.push(item);
setItemsSelected(s);
} else {
setItemsSelected(
itemsSelected.filter(
(i) => i.url !== item.url,
),
);
}
}}
/>
</Table.Cell>
)}
<Table.Cell>
<a
href={flattenToAppURL(item.url)}
Expand Down
34 changes: 18 additions & 16 deletions src/components/manage/VFPanel/VFPanelMenu.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ const messages = defineMessages({
defaultMessage: 'Loading...',
},
});
const VFPanelMenu = ({ toastify, doSearch }) => {
const VFPanelMenu = ({ toastify, doSearch, can_delete_feedbacks }) => {
const intl = useIntl();
const dispatch = useDispatch();
const [openConfirm, setOpenConfirm] = useState(false);
Expand Down Expand Up @@ -99,21 +99,23 @@ const VFPanelMenu = ({ toastify, doSearch }) => {
</Button>
</Menu.Item>

<Menu.Menu position="right">
<Menu.Item>
<Button
color="red"
icon
labelPosition="right"
onClick={() => setOpenConfirm(true)}
>
{intl.formatMessage(messages.delete_all)}
<i className="icon">
<Icon name={trashSVG} size="20px" />
</i>
</Button>
</Menu.Item>
</Menu.Menu>
{can_delete_feedbacks && (
<Menu.Menu position="right">
<Menu.Item>
<Button
color="red"
icon
labelPosition="right"
onClick={() => setOpenConfirm(true)}
>
{intl.formatMessage(messages.delete_all)}
<i className="icon">
<Icon name={trashSVG} size="20px" />
</i>
</Button>
</Menu.Item>
</Menu.Menu>
)}
<Confirm
cancelButton={intl.formatMessage(messages.cancel)}
open={openConfirm}
Expand Down

0 comments on commit ece04e8

Please sign in to comment.