Web: Files: added FileLifetime block
This commit is contained in:
parent
920e634322
commit
7a3cb28683
@ -34,5 +34,6 @@
|
||||
"RestrictCopyAndDownload": "Restrict copy and download",
|
||||
"RestrictCopyAndDownloadDescription": "Enable this setting to disable downloads and content copying for users with the \"{{role}}\" role.",
|
||||
"AddWatermarksToDocuments": "Add watermarks to documents",
|
||||
"AddWatermarksToDocumentsDescription": "Protect all documents in this room with watermarks. If a document already contains one, it will not be replaced."
|
||||
"AddWatermarksToDocumentsDescription": "Protect all documents in this room with watermarks. If a document already contains one, it will not be replaced.",
|
||||
"FilesOlderThan": "Files older than:"
|
||||
}
|
||||
|
@ -0,0 +1,114 @@
|
||||
import React, { useState } from "react";
|
||||
import styled from "styled-components";
|
||||
import Text from "@docspace/components/text";
|
||||
import TextInput from "@docspace/components/text-input";
|
||||
import ComboBox from "@docspace/components/combobox";
|
||||
|
||||
const StyledFileLifetime = styled.div`
|
||||
margin-top: 12px;
|
||||
|
||||
.virtual-data-room_file-lifetime_body {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.virtual-data-room_file-lifetime_input {
|
||||
min-width: 150px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.virtual-data-room_file-lifetime_combo-box {
|
||||
margin-right: 16px;
|
||||
width: 90px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const FileLifetime = ({ t }) => {
|
||||
const [inputValue, setInputValue] = useState("");
|
||||
const onChange = (e) => {
|
||||
// /^(?:[1-9][0-9]*|0)$/
|
||||
if (e.target.value && !/^(?:[1-9][0-9]*)$/.test(e.target.value)) return;
|
||||
|
||||
setInputValue(e.target.value);
|
||||
};
|
||||
|
||||
const isLoading = false;
|
||||
|
||||
const onSelectDate = (option) => {
|
||||
console.log("onDateSelect", option);
|
||||
};
|
||||
|
||||
const onSelectDelete = (option) => {
|
||||
console.log("onSelectDelete", option);
|
||||
};
|
||||
|
||||
const dateOptions = [
|
||||
{
|
||||
key: 1,
|
||||
label: t("Common:Days"),
|
||||
"data-type": 1,
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
label: t("Common:Months"),
|
||||
"data-type": 2,
|
||||
},
|
||||
{
|
||||
key: 3,
|
||||
label: t("Common:Years"),
|
||||
"data-type": 3,
|
||||
},
|
||||
];
|
||||
|
||||
const deleteOptions = [
|
||||
{
|
||||
key: 1,
|
||||
label: t("Common:MoveToTrash"),
|
||||
"data-type": 1,
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
label: t("Common:DeletePermanently"),
|
||||
"data-type": 2,
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<StyledFileLifetime className="virtual-data-room_file-lifetime">
|
||||
<Text fontWeight={600} fontSize="13px">
|
||||
{t("FilesOlderThan")}
|
||||
</Text>
|
||||
|
||||
<div className="virtual-data-room_file-lifetime_body">
|
||||
<TextInput
|
||||
className="virtual-data-room_file-lifetime_input"
|
||||
isAutoFocussed={true}
|
||||
isDisabled={isLoading}
|
||||
tabIndex={1}
|
||||
value={inputValue}
|
||||
onChange={onChange}
|
||||
scale
|
||||
/>
|
||||
<ComboBox
|
||||
className="virtual-data-room_file-lifetime_combo-box"
|
||||
options={dateOptions}
|
||||
isDisabled={isLoading}
|
||||
showDisabledItems
|
||||
selectedOption={dateOptions[0]}
|
||||
scaledOptions={true}
|
||||
onSelect={onSelectDate}
|
||||
/>
|
||||
<ComboBox
|
||||
options={deleteOptions}
|
||||
isDisabled={isLoading}
|
||||
showDisabledItems
|
||||
selectedOption={deleteOptions[0]}
|
||||
scale
|
||||
onSelect={onSelectDelete}
|
||||
/>
|
||||
</div>
|
||||
</StyledFileLifetime>
|
||||
);
|
||||
};
|
||||
|
||||
export default FileLifetime;
|
@ -3,6 +3,8 @@ import { Trans } from "react-i18next";
|
||||
import styled from "styled-components";
|
||||
import Text from "@docspace/components/text";
|
||||
import ToggleButton from "@docspace/components/toggle-button";
|
||||
import FileLifetime from "./FileLifetime";
|
||||
import { mobile } from "@docspace/components/utils/device";
|
||||
|
||||
const StyledVirtualDataRoomBlock = styled.div`
|
||||
.virtual-data-room-block {
|
||||
@ -20,12 +22,25 @@ const StyledVirtualDataRoomBlock = styled.div`
|
||||
}
|
||||
}
|
||||
.virtual-data-room-block_description {
|
||||
max-width: 420px;
|
||||
|
||||
@media ${mobile} {
|
||||
max-width: 315px;
|
||||
}
|
||||
|
||||
color: ${({ theme }) => theme.editLink.text.color};
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const Block = ({ headerText, bodyText, onChange, isDisabled, isChecked }) => {
|
||||
const Block = ({
|
||||
headerText,
|
||||
bodyText,
|
||||
onChange,
|
||||
isDisabled,
|
||||
isChecked,
|
||||
children,
|
||||
}) => {
|
||||
return (
|
||||
<div className="virtual-data-room-block">
|
||||
<div className="virtual-data-room-block_header">
|
||||
@ -47,7 +62,7 @@ const Block = ({ headerText, bodyText, onChange, isDisabled, isChecked }) => {
|
||||
{bodyText}
|
||||
</Text>
|
||||
{isChecked && (
|
||||
<div className="virtual-data-room-block_content">Content</div>
|
||||
<div className="virtual-data-room-block_content">{children}</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
@ -86,14 +101,16 @@ const VirtualDataRoomBlock = ({ t }) => {
|
||||
onChange={onChangeAutomaticIndexing}
|
||||
isDisabled={false}
|
||||
isChecked={automaticIndexingChecked}
|
||||
/>
|
||||
></Block>
|
||||
<Block
|
||||
headerText={t("FileLifetime")}
|
||||
bodyText={t("FileLifetimeDescription")}
|
||||
onChange={onChangeFileLifetime}
|
||||
isDisabled={false}
|
||||
isChecked={fileLifetimeChecked}
|
||||
/>
|
||||
>
|
||||
<FileLifetime t={t} />
|
||||
</Block>
|
||||
<Block
|
||||
headerText={t("RestrictCopyAndDownload")}
|
||||
bodyText={
|
||||
@ -105,14 +122,14 @@ const VirtualDataRoomBlock = ({ t }) => {
|
||||
onChange={onChangeRestrictCopyAndDownload}
|
||||
isDisabled={false}
|
||||
isChecked={copyAndDownloadChecked}
|
||||
/>
|
||||
></Block>
|
||||
<Block
|
||||
headerText={t("AddWatermarksToDocuments")}
|
||||
bodyText={t("AddWatermarksToDocumentsDescription")}
|
||||
onChange={onChangeAddWatermarksToDocuments}
|
||||
isDisabled={false}
|
||||
isChecked={watermarksChecked}
|
||||
/>
|
||||
></Block>
|
||||
</StyledVirtualDataRoomBlock>
|
||||
);
|
||||
};
|
||||
|
@ -284,5 +284,10 @@
|
||||
"WantToContinue": "Are you sure you want to continue?",
|
||||
"Warning": "Warning",
|
||||
"Website": "Website",
|
||||
"Yesterday": "Yesterday"
|
||||
"Yesterday": "Yesterday",
|
||||
"Days": "Days",
|
||||
"Months": "Months",
|
||||
"Years": "Years",
|
||||
"MoveToTrash": "Move to trash",
|
||||
"DeletePermanently": "Delete permanently"
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user