[CAL-1030] fix flickering border issue in menu layout for mobile (#7036)

* fix flickering border issue in menu layout for mobile

* transfer styles changes to the DropdownMenuItem

* remove button border for Remove button

* fix: use dropdownItem

Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>

---------

Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>
Co-authored-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>
This commit is contained in:
Amir Fakhrullah 2023-02-14 04:57:33 +08:00 committed by GitHub
parent 2e96e2ef3f
commit bef6d18fdf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -455,37 +455,30 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
<DropdownMenuPortal>
<DropdownMenuContent>
<DropdownMenuItem className="outline-none">
<Link href={calLink} target="_blank">
<Button
color="minimal"
StartIcon={FiExternalLink}
className="w-full rounded-none">
{t("preview")}
</Button>
</Link>
<DropdownItem
href={calLink}
target="_blank"
StartIcon={FiExternalLink}
className="w-full rounded-none">
{t("preview")}
</DropdownItem>
</DropdownMenuItem>
<DropdownMenuItem className="outline-none">
<Button
type="button"
color="minimal"
className="w-full rounded-none text-left"
<DropdownItem
data-testid={"event-type-duplicate-" + type.id}
StartIcon={FiClipboard}
onClick={() => {
navigator.clipboard.writeText(calLink);
showToast(t("link_copied"), "success");
}}>
}}
StartIcon={FiClipboard}
className="w-full rounded-none text-left">
{t("copy_link")}
</Button>
</DropdownItem>
</DropdownMenuItem>
{isNativeShare ? (
<DropdownMenuItem className="outline-none">
<Button
type="button"
color="minimal"
className="w-full rounded-none"
<DropdownItem
data-testid={"event-type-duplicate-" + type.id}
StartIcon={FiUpload}
onClick={() => {
navigator
.share({
@ -495,44 +488,41 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
})
.then(() => showToast(t("link_shared"), "success"))
.catch(() => showToast(t("failed"), "error"));
}}>
}}
StartIcon={FiUpload}
className="w-full rounded-none">
{t("share")}
</Button>
</DropdownItem>
</DropdownMenuItem>
) : null}
<DropdownMenuItem className="outline-none">
<Button
type="button"
<DropdownItem
onClick={() => router.push("/event-types/" + type.id)}
color="minimal"
className="w-full rounded-none"
StartIcon={FiEdit}>
StartIcon={FiEdit}
className="w-full rounded-none">
{t("edit")}
</Button>
</DropdownItem>
</DropdownMenuItem>
<DropdownMenuItem className="outline-none">
<Button
type="button"
color="minimal"
className="w-full rounded-none"
data-testid={"event-type-duplicate-" + type.id}
<DropdownItem
onClick={() => openDuplicateModal(type, group)}
StartIcon={FiCopy}
onClick={() => openDuplicateModal(type, group)}>
data-testid={"event-type-duplicate-" + type.id}>
{t("duplicate")}
</Button>
</DropdownItem>
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem className="outline-none">
<Button
<DropdownItem
color="destructive"
onClick={() => {
setDeleteDialogOpen(true);
setDeleteDialogTypeId(type.id);
}}
color="destructive"
StartIcon={FiTrash}
className="w-full rounded-none">
{t("delete")}
</Button>
</DropdownItem>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenuPortal>