Delete button in right drawer / side pannel

[ehconitin]

fixes #7069
@Bonapara

2024-09-23.17-42-55.mp4

[greptile-apps]

PR Summary

This PR adds a delete button to the right drawer/side panel of the show page, addressing issue #7069 by allowing users to delete notes/tasks directly from the side panel.

• Implemented delete functionality in packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageRightContainer.tsx
• Added a styled component StyledButtonContainer for consistent button placement
• Utilized useDeleteOneRecord hook for record deletion
• Conditionally rendered the delete button when the component is in the right drawer
• Improved user experience by enabling quick deletion without navigating to the Notes object list

_{1 file(s) reviewed, no comment(s)
Edit PR Review Bot Settings}

[bosiraphael]

Hello @ehconitin ! It seems that the trash Icon is missing in the button ;)

[ehconitin]

@bosiraphael oops, I am yet to finalize changes Raphael.
In #7168, I think I forgot to remove code which was to be addressed in that PR itself. I dont know how I missed it.
That issue needs to be addressed!
So right now I am thinking of a way I could handle that in this PR as these both buttons have similiar styles.
Ill tag you once done

[bosiraphael]

Left some comments :)

[bosiraphael]

@bosiraphael oops, I am yet to finalize changes Raphael. In #7168, I think I forgot to remove code which was to be addressed in that PR itself. I dont know how I missed it. That issue needs to be addressed! So right now I am thinking of a way I could handle that in this PR as these both buttons have similiar styles. Ill tag you once done

Okay no worries! When you are still working on your PR, you can open a draft PR instead, or just add the label WIP :)

[ehconitin]

@bosiraphael oops, I am yet to finalize changes Raphael. In #7168, I think I forgot to remove code which was to be addressed in that PR itself. I dont know how I missed it. That issue needs to be addressed! So right now I am thinking of a way I could handle that in this PR as these both buttons have similiar styles. Ill tag you once done

Okay no worries! When you are still working on your PR, you can open a draft PR instead, or just add the label WIP :)

@bosiraphael yup yup, will take a note of it for next time :)

[ehconitin]

@bosiraphael
for command menu to be alligned for mobile devices we do this, so should I follow the same pattern or having navigationBar height state makes more sense, so that we dont have to hardcode this value each time?

[bosiraphael]

@bosiraphael for command menu to be alligned for mobile devices we do this, so should I follow the same pattern or having navigationBar height state makes more sense, so that we dont have to hardcode this value each time?

I think the issue of the button being missaligned has something to do with the ShowPageRightContainer not being the right size, I don't think a state is the correct pattern but you can use a constant if you find it useful :)

[ehconitin]

@FelixMalfait
I narrowed down the issue, useDeleteOneRecord was not refetching queries like useRestoreManyRecords does.
I followed the same pattern from useRestoreManyRecords and it worked but within useRestoreManyRecords there is a comment above those refetch queries

 // TODO: fix optimistic effect
      const findOneQueryName = `FindOne${capitalize(objectNameSingular)}`;
      const findManyQueryName = `FindMany${capitalize(
        objectMetadataItem.namePlural,
      )}`;

2024-09-25.18-10-15.mp4

[ehconitin]

@bosiraphael
This is correct right? this is regarding the height of the right drawer.
Should i just use a local const like in CommandMenu? or create new const file and export it from there to both the files

[bosiraphael]

Second option is better to avoid code duplication :)

[FelixMalfait]

@ehconitin yes re-fetching is not a best practise, it throws an additional request to fetch the resource again, while we should instead be able to optimistically predict the result and modify the cache based on that

[ehconitin]

Hi @FelixMalfait, I don't have much expertise in this area, unfortunately.

@bosiraphael, could you assist with this? For more context, please follow the comment thread here.

[FelixMalfait]

As discussed in Discord, since we introduce Soft Delete, the delete isn't really a delete anymore, so we should instead leverage what's been done for optimistic updates when there's a delete, as what we call "delete" is actually closer to an update.
We should keep the code for optimistic delete but instead rename it and use it in the case of "destroy" (our internal name for "hard deletes")

[ehconitin]

@FelixMalfait Understood, I am still thinking about it :(. Ill get back to you!