refactored deviceLimit, linkExpiry and menuItem component

This commit is contained in:
Ananddubey01 2023-03-24 16:24:02 +05:30
parent 3d3ba6a98a
commit 65dd6ecda2
3 changed files with 32 additions and 36 deletions

View file

@ -25,48 +25,46 @@ export function ManageDeviceLimit({
deviceLimit: newLimit,
});
};
const [shareDeviceLimitModalView, setDeviceLimitModalView] =
useState(false);
const [shareDeviceLimitValue, setDeviceLimitValue] = useState(
publicShareProp.deviceLimit
);
useEffect(() => {
if (shareDeviceLimitModalView) {
setDeviceLimitModalView(true);
} else setDeviceLimitModalView(false);
}, [shareDeviceLimitModalView]);
const [changeDeviceLimitView, setChangeDeviceLimitView] = useState(false);
const closeShareExpiryOptionsModalView = () =>
setDeviceLimitModalView(false);
const openShareExpiryOptionsModalView = () => setDeviceLimitModalView(true);
const changeshareExpiryValue = (value: number) => () => {
setChangeDeviceLimitView(false);
const openShareExpiryOptionsModalView = () =>
setChangeDeviceLimitView(true);
const changeDeviceLimitValue = (value: number) => () => {
updateDeviceLimit(value);
setDeviceLimitValue(value);
setDeviceLimitModalView(false);
publicShareProp.deviceLimit = value;
setChangeDeviceLimitView(false);
};
useEffect(() => {
if (changeDeviceLimitView) {
setChangeDeviceLimitView(true);
} else setChangeDeviceLimitView(false);
}, [changeDeviceLimitView]);
return (
<>
<EnteMenuItem
onClick={openShareExpiryOptionsModalView}
endIcon={<ChevronRight />}
subText={String(shareDeviceLimitValue)}>
subText={String(publicShareProp.deviceLimit)}>
{t('LINK_DEVICE_LIMIT')}
</EnteMenuItem>
<EnteDrawer
anchor="right"
open={shareDeviceLimitModalView}
open={changeDeviceLimitView}
onClose={closeShareExpiryOptionsModalView}>
<DialogTitleWithCloseButton
onClose={closeShareExpiryOptionsModalView}>
{t('LINK_EXPIRY')}
</DialogTitleWithCloseButton>
<DialogContent>
{/* <OptionWithDivider data={shareExpiryOptions} /> */}
<tbody>
{getDeviceLimitOptions().map((item) => (
<tr key={item.label}>
<td>
<EnteMenuItem
onClick={changeshareExpiryValue(
onClick={changeDeviceLimitValue(
item.value
)}>
{item.label}

View file

@ -27,24 +27,25 @@ export function ManageLinkExpiry({
validTill: optionFn,
});
};
const [shareExpiryOptionsModalView, setShareExpiryOptionsModalView] =
useState(false);
const [shareExpiryValue, setShareExpiryValue] = useState(0);
const [labelText, setLabelText] = useState(
publicShareProp?.validTill
? formatDateTime(publicShareProp?.validTill / 1000)
: 'never'
);
useEffect(() => {
if (shareExpiryOptionsModalView) {
setShareExpiryOptionsModalView(true);
} else setShareExpiryOptionsModalView(false);
}, [shareExpiryOptionsModalView]);
const closeShareExpiryOptionsModalView = () =>
setShareExpiryOptionsModalView(false);
const openShareExpiryOptionsModalView = () =>
setShareExpiryOptionsModalView(true);
const changeshareExpiryValue = (value: number) => () => {
const changeShareExpiryValue = (value: number) => () => {
updateDeviceExpiry(value);
setLabelText(
publicShareProp?.validTill
@ -55,6 +56,13 @@ export function ManageLinkExpiry({
shareExpiryValue;
setShareExpiryOptionsModalView(false);
};
useEffect(() => {
if (shareExpiryOptionsModalView) {
setShareExpiryOptionsModalView(true);
} else setShareExpiryOptionsModalView(false);
}, [shareExpiryOptionsModalView]);
return (
<>
<EnteMenuItem
@ -72,13 +80,12 @@ export function ManageLinkExpiry({
{t('LINK_EXPIRY')}
</DialogTitleWithCloseButton>
<DialogContent>
{/* <OptionWithDivider data={shareExpiryOptions} /> */}
<tbody>
{shareExpiryOptions().map((item) => (
<tr key={item.label}>
<td>
<EnteMenuItem
onClick={changeshareExpiryValue(
onClick={changeShareExpiryValue(
item.value()
)}>
{item.label}

View file

@ -32,19 +32,11 @@ export function EnteMenuItem({
checked,
}: Iprops) {
const menuContext = useContext(OverflowMenuContext);
// const [buttonState, setButtonState] = useState<
// 'Default' | 'Loading' | 'Success'
// >('Default');
const handleClick = () => {
// setButtonState('Loading');
onClick();
if (!keepOpenAfterClick) {
menuContext.close();
}
// setButtonState('Success');
// setTimeout(() => {
// setButtonState('Default');
// }, 2000);
};
return (
<MenuItem
@ -88,7 +80,6 @@ export function EnteMenuItem({
{endIcon && (
<Box
sx={{
padding: 0,
marginLeft: 1,
}}>
{endIcon}