refactored deviceLimit, linkExpiry and menuItem component
This commit is contained in:
parent
3d3ba6a98a
commit
65dd6ecda2
|
@ -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}
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -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}
|
||||
|
|
Loading…
Reference in a new issue