added translations

This commit is contained in:
Maria Sukhova 2023-03-28 19:21:37 +03:00
commit deaa8880f0
49 changed files with 347 additions and 168 deletions

View File

@ -2,6 +2,5 @@
"ChangeUserStatusDialog": "{{ userStatus }} olan istifadəçilər {{ status }} olacaqlar.",
"ChangeUserStatusDialogHeader": "İstifadəçi statusunun dəyişdirilməsi",
"ChangeUsersActiveStatus": "iz ver",
"ChangeUsersDisableStatus": "söndürülüb",
"ChangeUsersStatusButton": "İstifadəçi statusunun dəyişdirilməsi"
"ChangeUsersDisableStatus": "söndürülüb"
}

View File

@ -3,6 +3,5 @@
"ChangeUserStatusDialogHeader": "Промени статус",
"ChangeUserStatusDialogMessage": "Не можете да смените статуса за собственика на DocSpace и за себе си.",
"ChangeUsersActiveStatus": "активиран",
"ChangeUsersDisableStatus": "активиран",
"ChangeUsersStatusButton": "Промени потребителския статус"
"ChangeUsersDisableStatus": "активиран"
}

View File

@ -3,6 +3,5 @@
"ChangeUserStatusDialogHeader": "Změnit status",
"ChangeUserStatusDialogMessage": "Nemůžete změnit status pro vlastníka DocSpace a pro sebe.",
"ChangeUsersActiveStatus": "aktivován",
"ChangeUsersDisableStatus": "aktivován",
"ChangeUsersStatusButton": "Změnit status uživatele"
"ChangeUsersDisableStatus": "aktivován"
}

View File

@ -3,6 +3,5 @@
"ChangeUserStatusDialogHeader": "Status ändern",
"ChangeUserStatusDialogMessage": "Sie können Status für Sie oder Portalbesitzer nicht ändern.",
"ChangeUsersActiveStatus": "aktiviert",
"ChangeUsersDisableStatus": "deaktiviert",
"ChangeUsersStatusButton": "Benutzerstatus ändern"
"ChangeUsersDisableStatus": "deaktiviert"
}

View File

@ -1,5 +1,4 @@
{
"ChangeUserStatusDialog": "Οι χρήστες με κατάσταση '{{ userStatus }}' θα είναι {{ status }}.",
"ChangeUserStatusDialogHeader": "Αλλαγή κατάστασης χρήστη",
"ChangeUsersStatusButton": "Αλλαγή κατάστασης χρήστη"
"ChangeUserStatusDialogHeader": "Αλλαγή κατάστασης χρήστη"
}

View File

@ -3,6 +3,5 @@
"ChangeUserStatusDialogHeader": "Change status",
"ChangeUserStatusDialogMessage": "You can't change the status for the DocSpace owner and for yourself.",
"ChangeUsersActiveStatus": "enabled",
"ChangeUsersDisableStatus": "disabled",
"ChangeUsersStatusButton": "Change user status"
"ChangeUsersDisableStatus": "disabled"
}

View File

@ -3,6 +3,5 @@
"ChangeUserStatusDialogHeader": "Cambiar estado",
"ChangeUserStatusDialogMessage": "No puede cambiar el estado para el propietario del portal y para usted mismo.",
"ChangeUsersActiveStatus": "activados",
"ChangeUsersDisableStatus": "desactivados",
"ChangeUsersStatusButton": "Cambiar estado de usuario"
"ChangeUsersDisableStatus": "desactivados"
}

View File

@ -1,5 +1,4 @@
{
"ChangeUserStatusDialog": "Käyttäjät, joilla on tila {{userStatus}}, tulee {{ status }}.",
"ChangeUserStatusDialogHeader": "Muuta käyttäjän tilaa",
"ChangeUsersStatusButton": "Muuta käyttäjän tilaa"
"ChangeUserStatusDialogHeader": "Muuta käyttäjän tilaa"
}

View File

@ -1,8 +1,7 @@
{
"ChangeUserStatusDialog": "Les utilisateurs avec le statut '{{ userStatus }}' seront {{ status }}",
"ChangeUserStatusDialogHeader": "Modifier le statut",
"ChangeUserStatusDialogHeader": "Modifier le statut de l'utilisateur",
"ChangeUserStatusDialogMessage": "Vous ne pouvez pas changer le statut du propriétaire de DocSpace ainsi que votre statut.",
"ChangeUsersActiveStatus": "activés",
"ChangeUsersDisableStatus": "désactivés",
"ChangeUsersStatusButton": "Modifier le statut de l'utilisateur"
"ChangeUsersDisableStatus": "désactivés"
}

View File

@ -1,5 +1,4 @@
{
"ChangeUserStatusDialog": "'{{ userStatus }}'ունեցող օգտվողները կլինեն {{ status }}.",
"ChangeUserStatusDialogHeader": "Փոխել օգտվողի կարգավիճակը",
"ChangeUsersStatusButton": "Փոխել օգտվողի կարգավիճակը"
"ChangeUserStatusDialogHeader": "Փոխել օգտվողի կարգավիճակը"
}

View File

@ -3,6 +3,5 @@
"ChangeUserStatusDialogHeader": "Cambia stato",
"ChangeUserStatusDialogMessage": "Non è possibile modificare lo stato per il proprietario di DocSpace e per te stesso",
"ChangeUsersActiveStatus": "attivati",
"ChangeUsersDisableStatus": "disattivati",
"ChangeUsersStatusButton": "Cambia lo stato dell'utente"
"ChangeUsersDisableStatus": "disattivati"
}

View File

@ -1,5 +1,4 @@
{
"ChangeUserStatusDialog": "ステータスが'{{ userStatus }}' のユーザーは {{ status }} になります。",
"ChangeUserStatusDialogHeader": "ユーザーステータスの変更",
"ChangeUsersStatusButton": "ユーザーステータスの変更"
"ChangeUserStatusDialogHeader": "ユーザーステータスの変更"
}

View File

@ -1,5 +1,4 @@
{
"ChangeUserStatusDialog": "'{{ userStatus }}' 상태 사용자는 {{ status }}.",
"ChangeUserStatusDialogHeader": "사용자 상태 변경",
"ChangeUsersStatusButton": "사용자 상태 변경"
"ChangeUserStatusDialogHeader": "사용자 상태 변경"
}

View File

@ -1,6 +1,5 @@
{
"ChangeUserStatusDialog": "ສະຖານະຂອງຜູ້ໃຊ້ທີ່ມີ '{{ userStatus }}' ຈະເປັນ {{ status }}.",
"ChangeUserStatusDialogHeader": "ປ່ຽນສະຖານະຜູ້ໃຊ້",
"ChangeUserStatusDialogMessage": "ທ່ານບໍ່ສາມາດປ່ຽນສະຖານະພາບສຳລັບເຈົ້າຂອງ DocSpace ແລະ ສຳລັບທ່ານເອງ",
"ChangeUsersStatusButton": "ປ່ຽນສະຖານະຜູ້ໃຊ້"
"ChangeUserStatusDialogMessage": "ທ່ານບໍ່ສາມາດປ່ຽນສະຖານະພາບສຳລັບເຈົ້າຂອງ DocSpace ແລະ ສຳລັບທ່ານເອງ"
}

View File

@ -1,6 +1,5 @@
{
"ChangeUserStatusDialog": "Lietotāji ar '{{ userStatus }}' statusu tiks {{ status }}.",
"ChangeUserStatusDialogHeader": "Mainiet lietotāja statusu",
"ChangeUserStatusDialogMessage": "Jūs nevarat mainīt statusu DocSpace īpašnieka un sev.",
"ChangeUsersStatusButton": "Mainīt lietotāja statusu"
"ChangeUserStatusDialogMessage": "Jūs nevarat mainīt statusu DocSpace īpašnieka un sev."
}

View File

@ -1,6 +1,5 @@
{
"ChangeUserStatusDialog": "De gebruikers met de '{{ userStatus }}' status zullen worden {{ status }}.",
"ChangeUserStatusDialogHeader": "Wijzig gebruikersstatus",
"ChangeUserStatusDialogMessage": "U kunt de status voor de DocSpace-eigenaar en voor uzelf niet veranderen.",
"ChangeUsersStatusButton": "Wijzig gebruikersstatus"
"ChangeUserStatusDialogMessage": "U kunt de status voor de DocSpace-eigenaar en voor uzelf niet veranderen."
}

View File

@ -3,6 +3,5 @@
"ChangeUserStatusDialogHeader": "Zmień status użytkownika",
"ChangeUserStatusDialogMessage": "Nie możesz zmienić swojego statusu, ani statusu właściciela DocSpace.",
"ChangeUsersActiveStatus": "aktywny",
"ChangeUsersDisableStatus": "nieaktywny",
"ChangeUsersStatusButton": "Zmień status użytkownika"
"ChangeUsersDisableStatus": "nieaktywny"
}

View File

@ -3,6 +3,5 @@
"ChangeUserStatusDialogHeader": "Alterar status",
"ChangeUserStatusDialogMessage": "Você não pode mudar o status para o proprietário do DocSpace e para você mesmo.",
"ChangeUsersActiveStatus": "abilitado",
"ChangeUsersDisableStatus": "desabilitado",
"ChangeUsersStatusButton": "Alterar status de usuário"
"ChangeUsersDisableStatus": "desabilitado"
}

View File

@ -3,6 +3,5 @@
"ChangeUserStatusDialogHeader": "Alterar estado",
"ChangeUserStatusDialogMessage": "Não pode alterar o estado para o dono do DocSpace e para si próprio.",
"ChangeUsersActiveStatus": "ativado",
"ChangeUsersDisableStatus": "desabilitado",
"ChangeUsersStatusButton": "Alterar estado de utilizador"
"ChangeUsersDisableStatus": "desabilitado"
}

View File

@ -3,6 +3,5 @@
"ChangeUserStatusDialogHeader": "Schimbați statutul utilizatorului",
"ChangeUserStatusDialogMessage": "Nu puteți schimba statutul posesorului portalului și nici al dumneavoastră.",
"ChangeUsersActiveStatus": "activat",
"ChangeUsersDisableStatus": "desactivat",
"ChangeUsersStatusButton": "Schimbați statutul utilizatorului"
"ChangeUsersDisableStatus": "desactivat"
}

View File

@ -3,6 +3,5 @@
"ChangeUserStatusDialogHeader": "Изменение статуса",
"ChangeUserStatusDialogMessage": "Вы не можете изменить статус владельца DocSpace и свой собственный статус.",
"ChangeUsersActiveStatus": "разблокированы",
"ChangeUsersDisableStatus": "заблокированы",
"ChangeUsersStatusButton": "Изменить статус пользователя"
"ChangeUsersDisableStatus": "заблокированы"
}

View File

@ -2,6 +2,5 @@
"ChangeUserStatusDialog": "Používatelia so stavom '{{ userStatus }}' budú {{ status }}.",
"ChangeUserStatusDialogHeader": "Zmeniť stav",
"ChangeUserStatusDialogMessage": "Nemôžete zmeniť svoj stav a stav vlastníka DocSpace.",
"ChangeUsersActiveStatus": "aktivovaný",
"ChangeUsersStatusButton": "Zmeniť stav používateľa"
"ChangeUsersActiveStatus": "aktivovaný"
}

View File

@ -1,6 +1,5 @@
{
"ChangeUserStatusDialog": "Uporabniki z '{{ userStatus }}' statusom bodo {{ status }}.",
"ChangeUserStatusDialogHeader": "Spremeni status",
"ChangeUserStatusDialogMessage": "Status lastnika DocSpace in svojega statusa ne morete spremeniti.",
"ChangeUsersStatusButton": "Spremeni status uporabnika"
"ChangeUserStatusDialogMessage": "Status lastnika DocSpace in svojega statusa ne morete spremeniti."
}

View File

@ -1,6 +1,5 @@
{
"ChangeUserStatusDialog": "'{{ userStatus }} durumuna sahip kullanıcılar {{ status }} olacak.",
"ChangeUserStatusDialogHeader": "Kullanıcı durumunu değiştir",
"ChangeUserStatusDialogMessage": "DocSpace sahibi ve kendiniz için durumu değiştiremezsiniz.",
"ChangeUsersStatusButton": "Kullanıcı durumunu değiştir"
"ChangeUserStatusDialogMessage": "DocSpace sahibi ve kendiniz için durumu değiştiremezsiniz."
}

View File

@ -1,6 +1,5 @@
{
"ChangeUserStatusDialog": "Користувача зі статусом '{{ userStatus }}' буде {{ status }}.",
"ChangeUserStatusDialogHeader": "Змінити статус",
"ChangeUserStatusDialogMessage": "Ви не можете змінити статус власника DocSpace та свій статус.",
"ChangeUsersStatusButton": "Змінити статус користувача"
"ChangeUserStatusDialogMessage": "Ви не можете змінити статус власника DocSpace та свій статус."
}

View File

@ -1,5 +1,4 @@
{
"ChangeUserStatusDialog": "Người dùng có trạng thái '{{ userStatus }}' sẽ bị {{ status }}.",
"ChangeUserStatusDialogHeader": "Thay đổi trạng thái người dùng",
"ChangeUsersStatusButton": "Thay đổi trạng thái người dùng"
"ChangeUserStatusDialogHeader": "Thay đổi trạng thái người dùng"
}

View File

@ -1,5 +1,4 @@
{
"ChangeUserStatusDialog": "带有‘{{ userStatus }}’状态的用户将‘{{ userStatus }}",
"ChangeUserStatusDialogHeader": "变更用户状态",
"ChangeUsersStatusButton": "变更用户状态"
"ChangeUserStatusDialogHeader": "变更用户状态"
}

View File

@ -100,7 +100,7 @@ class ChangeUserStatusDialogComponent extends React.Component {
<ModalDialog.Footer>
<Button
id="change-user-status-modal_submit"
label={t("ChangeUsersStatusButton")}
label={t("Common:ChangeButton")}
size="normal"
primary
scale

View File

@ -57,6 +57,9 @@ const StyledInfoPanelToggleWrapper = styled.div`
margin-left: auto;
display: ${(props) => (props.isInfoPanelVisible ? "none" : "flex")};
align-items: center;
justify-content: center;
@media ${tablet} {
display: none;
}
@ -68,6 +71,8 @@ const StyledInfoPanelToggleWrapper = styled.div`
align-items: center;
justify-content: center;
border-radius: 50%;
margin-bottom: 1px;
background-color: ${(props) =>
props.isInfoPanelVisible
? props.theme.infoPanel.sectionHeaderToggleBgActive

View File

@ -67,6 +67,8 @@ const FilesTileContainer = ({
const { width } = node.getBoundingClientRect();
if (width === 0) return;
const size = thumbnails1280x720 ? "1280x720" : getThumbSize(width);
const widthWithoutPadding = width - 32;

View File

@ -16,9 +16,9 @@ import { DNSSettingsTooltip } from "../sub-components/common-tooltips";
import { StyledSettingsComponent, StyledScrollbar } from "./StyledSettings";
import { setDocumentTitle } from "SRC_DIR/helpers/utils";
import LoaderCustomization from "../sub-components/loaderCustomization";
import Textarea from "@docspace/components/textarea";
import withLoading from "SRC_DIR/HOCs/withLoading";
import Badge from "@docspace/components/badge";
const DNSSettings = (props) => {
const {
t,
@ -108,10 +108,10 @@ const DNSSettings = (props) => {
labelText={`${t("YourCurrentDomain")}`}
isVertical={true}
>
<Textarea
<TextInput
id="textInputContainerDNSSettings"
className="dns-textarea"
heightTextArea={30}
scale={true}
tabIndex={8}
isDisabled={true}
value={location.hostname}

View File

@ -5,7 +5,12 @@ import {
} from "../../../utils/commonSettingsStyles";
import globalColors from "@docspace/components/utils/globalColors";
import { isMobileOnly } from "react-device-detect";
import { hugeMobile, tablet, mobile } from "@docspace/components/utils/device";
import {
hugeMobile,
tablet,
mobile,
smallTablet,
} from "@docspace/components/utils/device";
const linkColor = globalColors.black;
@ -239,6 +244,10 @@ const StyledRestoreBackup = styled.div`
.restore-backup_input {
margin: 16px 0;
max-width: ${INPUT_LENGTH};
@media ${smallTablet} {
max-width: none;
}
}
.restore-description {
margin-bottom: 24px;
@ -250,7 +259,9 @@ const StyledRestoreBackup = styled.div`
margin-bottom: 16px;
}
.restore-backup_button {
${isMobileOnly && "width:100%"}
@media ${smallTablet} {
width: 100%;
}
}
${(props) => !props.isEnableRestore && UnavailableStyles}
`;

View File

@ -10,7 +10,7 @@ import { combineUrl } from "@docspace/common/utils";
import config from "../../../../../package.json";
const DeleteData = (props) => {
const { t, history, isNotPaidPeriod } = props;
const { t, history, isNotPaidPeriod, tReady } = props;
const [currentTab, setCurrentTab] = useState(0);
const [isLoading, setIsLoading] = useState(false);
@ -45,7 +45,7 @@ const DeleteData = (props) => {
);
};
if (!isLoading) return <DeleteDataLoader />;
if (!isLoading || !tReady) return <DeleteDataLoader />;
return isNotPaidPeriod ? (
<PortalDeletionSection />
) : (

View File

@ -12,6 +12,15 @@ import Link from "@docspace/components/link";
import toastr from "@docspace/components/toast/toastr";
import ModalDialogContainer from "./modalDialogContainer";
import { showLoader, hideLoader } from "@docspace/common/utils";
import { hugeMobile } from "@docspace/components/utils/device";
import styled from "styled-components";
const StyledBox = styled(Box)`
padding: 20px 0 8px;
@media ${hugeMobile} {
padding-top: 0;
}
`;
class ConsumerModalDialog extends React.Component {
constructor(props) {
@ -85,7 +94,7 @@ class ConsumerModalDialog extends React.Component {
thirdPartyServicesUrl = () => {
switch (this.props.selectedConsumer.name) {
case "docuSign":
case "docusign" || "docuSign":
return this.props.docuSignUrl;
case "dropbox":
return this.props.dropboxUrl;
@ -151,7 +160,7 @@ class ConsumerModalDialog extends React.Component {
);
supportTeamDescription = (
<Box paddingProp="20px 0 8px">
<StyledBox>
<Trans
t={this.props.t}
i18nKey="ThirdPartyBottomDescription"
@ -168,7 +177,7 @@ class ConsumerModalDialog extends React.Component {
Support Team
</Link>
</Trans>
</Box>
</StyledBox>
);
render() {
@ -231,7 +240,7 @@ class ConsumerModalDialog extends React.Component {
<Button
primary
size="normal"
label={isLoading ? t("Common:Sending") : t("Common:Connect")}
label={isLoading ? t("Common:Sending") : t("Common:Enable")}
isLoading={isLoading}
isDisabled={isLoading}
scale

View File

@ -46,6 +46,10 @@ export const StyledContent = styled.div`
margin: 0 auto;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
@media ${hugeMobile} {
min-height: 100%;
}
`;
export const WizardContainer = styled.div`
@ -61,8 +65,7 @@ export const WizardContainer = styled.div`
}
@media ${hugeMobile} {
margin-top: 32px;
width: calc(100% - 32px);
margin: 32px auto;
}
.docspace-logo {
@ -74,6 +77,10 @@ export const WizardContainer = styled.div`
.welcome-text {
padding-bottom: 32px;
@media ${hugeMobile} {
max-width: 343px;
}
}
.form-header {

View File

@ -280,7 +280,12 @@ const Wizard = (props) => {
<StyledContent>
<WizardContainer>
<DocspaceLogo className="docspace-logo" />
<Text fontWeight={700} fontSize="23px" className="welcome-text">
<Text
as="div"
fontWeight={700}
fontSize="23px"
className="welcome-text"
>
{t("WelcomeTitle")}
</Text>
<FormWrapper>
@ -407,6 +412,7 @@ const Wizard = (props) => {
{t("Timezone")}
</Text>
<ComboBox
textOverflow
withoutPadding
directionY="both"
options={timezones}

View File

@ -433,38 +433,29 @@ export const frameCallCommand = (commandName: string, commandData: any) => {
);
};
export const getConvertedSize = (t, size) => {
let sizeNames;
export const getConvertedSize = (t, bytes) => {
let power = 0,
resultSize = bytes;
if (size < 0) return `${8 + " " + t("Common:Exabyte")}`;
const sizeNames = [
t("Common:Bytes"),
t("Common:Kilobyte"),
t("Common:Megabyte"),
t("Common:Gigabyte"),
t("Common:Terabyte"),
t("Common:Petabyte"),
t("Common:Exabyte"),
];
if (size < 1024 * 1024) {
sizeNames = [
t("Common:Megabyte"),
t("Common:Gigabyte"),
t("Common:Terabyte"),
];
} else {
sizeNames = [
t("Common:Bytes"),
t("Common:Kilobyte"),
t("Common:Megabyte"),
t("Common:Gigabyte"),
t("Common:Terabyte"),
t("Common:Petabyte"),
t("Common:Exabyte"),
];
if (bytes <= 0) return `${"0" + " " + t("Common:Bytes")}`;
if (bytes >= 1024) {
power = Math.floor(Math.log(bytes) / Math.log(1024));
power = power < sizeNames.length ? power : sizeNames.length - 1;
resultSize = parseFloat((bytes / Math.pow(1024, power)).toFixed(2));
}
const bytes = size;
if (bytes == 0) return `${"0" + " " + t("Common:Bytes")}`;
const i = Math.floor(Math.log(bytes) / Math.log(1024));
return (
parseFloat((bytes / Math.pow(1024, i)).toFixed(2)) + " " + sizeNames[i]
);
return resultSize + " " + sizeNames[power];
};
export const getBgPattern = (colorSchemeId: number | undefined) => {

View File

@ -20,7 +20,7 @@ const StyledBadge = styled.div`
line-height: ${(props) => props.theme.badge.lineHeight};
cursor: pointer;
overflow: ${(props) => props.theme.badge.overflow};
flex-shrink: 0;
&:hover {
${(props) => !props.noHover && hoveredCss};
}

View File

@ -51,7 +51,8 @@ class ComboBox extends React.Component {
isDisabled ||
disableItemClick ||
isLoading ||
(disableIconClick && e && e.target.closest(".optionalBlock"))
(disableIconClick && e && e.target.closest(".optionalBlock")) ||
e?.target.classList.contains("nav-thumb-vertical")
)
return;
@ -233,6 +234,7 @@ class ComboBox extends React.Component {
displaySelectedOption &&
option.label === selectedOption.label;
const isSelected = option.label === selectedOption.label;
return (
<DropDownItem
{...option}
@ -243,6 +245,7 @@ class ComboBox extends React.Component {
fillIcon={fillIcon}
isModern={noBorder}
isActive={isActive}
isSelected={isSelected}
/>
);
})}

View File

@ -24,6 +24,8 @@ const DropDownItem = (props) => {
withoutIcon,
noHover,
height,
isSelected,
isActiveDescendant,
} = props;
const onClickAction = (e) => {
@ -38,6 +40,8 @@ const DropDownItem = (props) => {
onClick={onClickAction}
disabled={disabled}
isActive={isActive}
isSelected={isSelected}
isActiveDescendant={isActiveDescendant}
>
{icon && (
<IconWrapper className="drop-down-icon">
@ -102,6 +106,8 @@ DropDownItem.propTypes = {
isActive: PropTypes.bool,
withoutIcon: PropTypes.bool,
isModern: PropTypes.bool,
isActiveDescendant: PropTypes.bool,
isSelected: PropTypes.bool,
};
DropDownItem.defaultProps = {

View File

@ -84,11 +84,13 @@ const StyledDropdownItem = styled.div`
${itemTruncate}
&:hover {
background-color: ${(props) =>
props.noHover
? props.theme.dropDownItem.backgroundColor
: props.theme.dropDownItem.hoverBackgroundColor};
text-align: left;
${(props) =>
!props.noHover &&
css`
background-color: ${(props) =>
props.theme.dropDownItem.hoverBackgroundColor};
text-align: left;
`}
}
${(props) =>
@ -121,7 +123,23 @@ const StyledDropdownItem = styled.div`
padding: ${(props) => props.theme.dropDownItem.tabletPadding};
}
${(props) => props.disabled && disabledAndHeaderStyle}
${(props) =>
props.isActiveDescendant &&
!props.disabled &&
css`
background-color: ${(props) =>
props.theme.dropDownItem.hoverBackgroundColor};
text-align: left;
`}
${(props) => props.disabled && !props.isSelected && disabledAndHeaderStyle}
${(props) =>
((props.disabled && props.isSelected) || props.isActive) &&
css`
background-color: ${(props) =>
props.theme.dropDownItem.selectedBackgroundColor};
`}
.submenu-arrow {
margin-left: auto;
@ -133,13 +151,6 @@ const StyledDropdownItem = styled.div`
`}
}
${(props) =>
props.isActive &&
css`
background-color: ${(props) =>
props.theme.dropDownItem.hoverBackgroundColor} !important;
`}
@media (max-width: 500px) {
max-width: 100vw;
}

View File

@ -0,0 +1,142 @@
import React, {
NamedExoticComponent,
ReactElement,
useCallback,
useEffect,
useMemo,
useRef,
useState,
} from "react";
import { VariableSizeList } from "react-window";
import Scrollbar from "@docspace/components/scrollbar";
import CustomScrollbarsVirtualList from "../scrollbar/custom-scrollbars-virtual-list";
type VirtualListProps = {
width: number;
theme: unknown;
isOpen: boolean;
itemCount: number;
maxHeight: number;
calculatedHeight: number;
isNoFixedHeightOptions: boolean;
cleanChildren: ReactElement[];
children: ReactElement[];
Row: NamedExoticComponent<object>;
getItemSize: (index: number) => number;
};
function VirtualList({
Row,
width,
theme,
isOpen,
children,
itemCount,
maxHeight,
cleanChildren,
calculatedHeight,
isNoFixedHeightOptions,
getItemSize,
}: VirtualListProps) {
const ref = useRef<VariableSizeList>(null);
const activeIndex = useMemo(() => {
let foundIndex = -1;
React.Children.forEach(cleanChildren, (child, index) => {
if (child.props.disabled) foundIndex = index;
});
return foundIndex;
}, [cleanChildren]);
const [currentIndex, setCurrentIndex] = useState(activeIndex);
const currentIndexRef = useRef<number>(activeIndex);
useEffect(() => {
if (isOpen && maxHeight) {
window.addEventListener("keydown", onKeyDown);
}
return () => {
window.removeEventListener("keydown", onKeyDown);
if (itemCount > 0 && ref.current) {
setCurrentIndex(activeIndex);
currentIndexRef.current = activeIndex;
ref.current.scrollToItem(activeIndex, "smart");
}
};
}, [isOpen, activeIndex, maxHeight]);
const onKeyDown = useCallback(
(event: KeyboardEvent) => {
if (!ref.current || !isOpen) return;
event.preventDefault();
let index = currentIndexRef.current;
switch (event.code) {
case "ArrowDown":
index++;
break;
case "ArrowUp":
index--;
break;
case "Enter":
children[index]?.props?.onClick();
break;
default:
return;
}
if (index < 0 || index >= React.Children.count(children)) return;
setCurrentIndex(index);
currentIndexRef.current = index;
ref.current.scrollToItem(index, "smart");
},
[isOpen]
);
const handleMouseMove = useCallback((index: number) => {
if (currentIndexRef.current === index) return;
setCurrentIndex(index);
currentIndexRef.current = index;
}, []);
if (!maxHeight) return cleanChildren ? cleanChildren : children;
return (
<>
{isNoFixedHeightOptions ? (
//@ts-ignore
<Scrollbar style={{ height: maxHeight }} stype="mediumBlack">
{cleanChildren}
</Scrollbar>
) : (
<VariableSizeList
ref={ref}
width={width}
itemCount={itemCount}
itemSize={getItemSize}
height={calculatedHeight}
itemData={{
children: cleanChildren,
theme: theme,
activeIndex,
activedescendant: currentIndex,
handleMouseMove,
}}
outerElementType={CustomScrollbarsVirtualList}
>
{Row}
</VariableSizeList>
)}
</>
);
}
export default VirtualList;

View File

@ -1,21 +1,21 @@
import React, { memo } from "react";
import PropTypes from "prop-types";
import { VariableSizeList } from "react-window";
import onClickOutside from "react-onclickoutside";
import { isMobile } from "react-device-detect";
import Portal from "../portal";
import DomHelpers from "../utils/domHelpers";
import CustomScrollbarsVirtualList from "../scrollbar/custom-scrollbars-virtual-list";
import DropDownItem from "../drop-down-item";
import Backdrop from "../backdrop";
import StyledDropdown from "./styled-drop-down";
import Scrollbar from "@docspace/components/scrollbar";
import VirtualList from "./VirtualList";
/* eslint-disable react/prop-types, react/display-name */
const Row = memo(({ data, index, style }) => {
const option = data.children[index];
const { children, theme, activedescendant, handleMouseMove } = data;
const option = children[index];
const separator = option?.props?.isSeparator
? { width: `calc(100% - 32px)`, height: `1px` }
@ -24,10 +24,15 @@ const Row = memo(({ data, index, style }) => {
return (
<DropDownItem
theme={data.theme}
theme={theme}
// eslint-disable-next-line react/prop-types
{...option?.props}
noHover
style={newStyle}
onMouseMove={() => {
handleMouseMove(index);
}}
isActiveDescendant={activedescendant === index}
/>
);
});
@ -250,6 +255,7 @@ class DropDown extends React.PureComponent {
theme,
isMobileView,
isNoFixedHeightOptions,
open,
} = this.props;
const { directionX, directionY, width, manualY } = this.state;
@ -282,30 +288,22 @@ class DropDown extends React.PureComponent {
isExternalLink={this.props.isExternalLink}
isPersonal={this.props.isPersonal}
isMobileView={isMobileView}
itemCount={itemCount}
{...dropDownMaxHeightProp}
>
{maxHeight ? (
isNoFixedHeightOptions ? (
<Scrollbar style={{ height: maxHeight }} stype="mediumBlack">
{cleanChildren}
</Scrollbar>
) : (
<VariableSizeList
height={calculatedHeight}
width={width}
itemSize={getItemSize}
itemCount={itemCount}
itemData={{ children: cleanChildren, theme: theme }}
outerElementType={CustomScrollbarsVirtualList}
>
{Row}
</VariableSizeList>
)
) : cleanChildren ? (
cleanChildren
) : (
children
)}
<VirtualList
Row={Row}
theme={theme}
width={width}
itemCount={itemCount}
maxHeight={maxHeight}
cleanChildren={cleanChildren}
calculatedHeight={calculatedHeight}
isNoFixedHeightOptions={isNoFixedHeightOptions}
getItemSize={getItemSize}
children={children}
isOpen={open}
/>
</StyledDropdown>
);
}

View File

@ -58,11 +58,7 @@ const StyledDropdown = styled.div`
box-shadow: ${(props) => props.theme.dropDown.boxShadow};
-moz-box-shadow: ${(props) => props.theme.dropDown.boxShadow};
-webkit-box-shadow: ${(props) => props.theme.dropDown.boxShadow};
padding: ${(props) =>
!props.maxHeight &&
props.children &&
props.children.length > 1 &&
`4px 0px`};
padding: ${(props) => !props.maxHeight && props.itemCount > 1 && `4px 0px`};
${(props) =>
props.columnCount &&
`

View File

@ -4,10 +4,14 @@ import Scrollbar from "../scrollbar";
export class CustomScrollbars extends React.Component {
refSetter = (scrollbarsRef, forwardedRef) => {
if (scrollbarsRef) {
forwardedRef(scrollbarsRef.view);
const isFuntion = typeof forwardedRef === "function";
const ref = scrollbarsRef?.view ?? null;
if (isFuntion) {
forwardedRef(ref);
} else {
forwardedRef(null);
forwardedRef = ref;
}
};
@ -23,9 +27,7 @@ export class CustomScrollbars extends React.Component {
//console.log("CustomScrollbars", this.props);
return (
<Scrollbar
ref={(scrollbarsRef) =>
this.refSetter.bind(this, scrollbarsRef, forwardedRef)
}
ref={(scrollbarsRef) => this.refSetter(scrollbarsRef, forwardedRef)}
style={{ ...style, overflow: "hidden" }}
onScroll={onScroll}
stype={stype}

View File

@ -1394,6 +1394,7 @@ const Base = {
backgroundColor: white,
hoverBackgroundColor: grayLight,
hoverDisabledBackgroundColor: white,
selectedBackgroundColor: lightHover,
fontWeight: "600",
fontSize: "13px",
width: "100%",

View File

@ -1384,6 +1384,7 @@ const Dark = {
backgroundColor: black,
hoverBackgroundColor: "#3D3D3D",
hoverDisabledBackgroundColor: black,
selectedBackgroundColor: "#282828",
fontWeight: "600",
fontSize: "13px",
width: "100%",

View File

@ -115,13 +115,21 @@ public class ThumbnailSettings
set => _maxDegreeOfParallelism = value;
}
private long? _availableFileSize;
public long? AvailableFileSize
private long? _maxImageFileSize;
public long? MaxImageFileSize
{
get => _availableFileSize ?? 100L * 1024L * 1024L;
set => _availableFileSize = value;
get => _maxImageFileSize ?? 30L * 1024L * 1024L;
set => _maxImageFileSize = value;
}
private long? _maxVideoFileSize;
public long? MaxVideoFileSize
{
get => _maxVideoFileSize ?? 1000L * 1024L * 1024L;
set => _maxVideoFileSize = value;
}
private int? _attemptsLimit;
public int? AttemptsLimit
{

View File

@ -132,9 +132,7 @@ public class Builder<T>
return;
}
var ext = FileUtility.GetFileExtension(file.Title);
if (!CanCreateThumbnail(ext) || file.Encrypted || file.RootFolderType == FolderType.TRASH || file.ContentLength > _config.AvailableFileSize)
if (!CanCreateThumbnail(file))
{
file.ThumbnailStatus = Core.Thumbnail.NotRequired;
@ -145,21 +143,19 @@ public class Builder<T>
await fileDao.SetThumbnailStatusAsync(file, Core.Thumbnail.Creating);
var ext = FileUtility.GetFileExtension(file.Title);
if (IsVideo(ext))
{
await MakeThumbnailFromVideo(fileDao, file);
}
else if (IsImage(ext))
{
await MakeThumbnailFromImage(fileDao, file);
}
else
{
if (IsImage(ext))
{
await MakeThumbnailFromImage(fileDao, file);
}
else
{
await MakeThumbnailFromDocs(fileDao, file);
}
await MakeThumbnailFromDocs(fileDao, file);
}
await fileDao.SetThumbnailStatusAsync(file, Core.Thumbnail.Created);
@ -341,6 +337,17 @@ public class Builder<T>
_logger.DebugMakeThumbnail4(file.Id.ToString());
}
public bool CanCreateThumbnail(File<T> file)
{
var ext = FileUtility.GetFileExtension(file.Title);
if (!CanCreateThumbnail(ext) || file.Encrypted || file.RootFolderType == FolderType.TRASH) return false;
if (IsVideo(ext) && file.ContentLength > _config.MaxVideoFileSize) return false;
if (IsImage(ext) && file.ContentLength > _config.MaxImageFileSize) return false;
return true;
}
private bool CanCreateThumbnail(string extention)
{
return _config.FormatsArray.Contains(extention) || IsVideo(extention) || IsImage(extention);