Merge branch 'develop' into refactoring/global-colors

This commit is contained in:
Viktor Fomin 2024-06-14 12:52:37 +05:00
commit d3f7692bad
19 changed files with 64 additions and 19 deletions

View File

@ -14,6 +14,7 @@
"NameChangeButton": "Change name",
"PasswordChangeButton": "Change password",
"PendingTitle": "Pending",
"PendingInviteTitle": "Pending invite",
"PeopleCount": "people: {{count}}",
"RemoveData": "Delete personal data",
"ResetAuth": "Reset authentication",

View File

@ -66,8 +66,14 @@ const AvatarEditorDialog = (props) => {
"CreateEditRoomDialog",
]);
const { visible, onClose, profile, updateCreatedAvatar, setHasAvatar } =
props;
const {
visible,
onClose,
profile,
updateCreatedAvatar,
setHasAvatar,
maxImageUploadSize,
} = props;
const [avatar, setAvatar] = useState({
uploadedFile: profile.hasAvatar
? profile.avatarOriginal
@ -141,6 +147,7 @@ const AvatarEditorDialog = (props) => {
Preview={
<AvatarPreview avatar={preview} userName={profile.displayName} />
}
maxImageSize={maxImageUploadSize}
/>
</ModalDialog.Body>
<ModalDialog.Footer>
@ -167,8 +174,9 @@ const AvatarEditorDialog = (props) => {
);
};
export default inject(({ peopleStore }) => {
export default inject(({ peopleStore, settingsStore }) => {
const { targetUserStore } = peopleStore;
const { maxImageUploadSize } = settingsStore;
const {
targetUser: profile,
@ -180,5 +188,6 @@ export default inject(({ peopleStore }) => {
profile,
setHasAvatar,
updateCreatedAvatar,
maxImageUploadSize,
};
})(observer(AvatarEditorDialog));

View File

@ -95,6 +95,7 @@ const SetRoomParams = ({
setChangeRoomOwnerIsVisible,
folderFormValidation,
disabledChangeRoomType,
maxImageUploadSize,
}) => {
const [previewIcon, setPreviewIcon] = useState(null);
const [createNewFolderIsChecked, setCreateNewFolderIsChecked] =
@ -249,6 +250,7 @@ const SetRoomParams = ({
onChangeImage={onChangeIcon}
classNameWrapperImageCropper={"icon-editor"}
disableImageRescaling={disableImageRescaling}
maxImageSize={maxImageUploadSize}
Preview={
<PreviewTile
t={t}
@ -272,12 +274,13 @@ export default inject(({ settingsStore, dialogsStore, currentQuotaStore }) => {
const { isDefaultRoomsQuotaSet } = currentQuotaStore;
const { setChangeRoomOwnerIsVisible } = dialogsStore;
const { folderFormValidation } = settingsStore;
const { folderFormValidation, maxImageUploadSize } = settingsStore;
return {
isDefaultRoomsQuotaSet,
folderFormValidation,
setChangeRoomOwnerIsVisible,
maxImageUploadSize,
};
})(
observer(

View File

@ -41,6 +41,8 @@ const useAccounts = ({
setSelectedNode,
fetchPeople,
setPortalTariff,
scrollToTop,
}) => {
React.useEffect(() => {
if (!isAccountsPage || !isPeopleAccounts) return;
@ -56,6 +58,7 @@ const useAccounts = ({
if (err?.response?.status === 402) setPortalTariff();
})
.finally(() => {
scrollToTop();
setIsLoading(false);
});
}, [isAccountsPage, isPeopleAccounts, location.pathname, location.search]);

View File

@ -70,6 +70,8 @@ const useFiles = ({
gallerySelected,
folderSecurity,
userId,
scrollToTop,
}) => {
const navigate = useNavigate();
const { id } = useParams();
@ -309,6 +311,7 @@ const useFiles = ({
}
})
.finally(() => {
scrollToTop();
setIsLoading(false);
});
}, [isAccountsPage, isSettingsPage, location.pathname, location.search]);

View File

@ -39,6 +39,7 @@ const useGroups = ({
setSelectedNode,
fetchGroups,
scrollToTop,
}) => {
useEffect(() => {
if (!isAccountsPage || !isGroupsAccounts) return;
@ -53,7 +54,10 @@ const useGroups = ({
.catch((err) => {
console.error(err);
})
.finally(() => setIsLoading(false));
.finally(() => {
scrollToTop();
setIsLoading(false);
});
}, [isAccountsPage, isGroupsAccounts, location.pathname, location.search]);
};

View File

@ -39,6 +39,7 @@ const useInsideGroup = ({
setIsLoading,
fetchGroup,
setPortalTariff,
scrollToTop,
}) => {
const isInsideGroup = matchPath(
"/accounts/groups/:groupId/filter",
@ -58,6 +59,7 @@ const useInsideGroup = ({
if (err?.response?.status === 402) setPortalTariff();
})
.finally(() => {
scrollToTop();
setIsLoading(false);
});
}, [groupId, location.pathname, location.search]);

View File

@ -74,7 +74,7 @@ const Accounts = (props) => {
case EmployeeStatus.Active:
return setStatusLabel(t("Common:Active"));
case EmployeeStatus.Pending:
return setStatusLabel(t("PeopleTranslations:PendingTitle"));
return setStatusLabel(t("PeopleTranslations:PendingInviteTitle"));
case EmployeeStatus.Disabled:
return setStatusLabel(t("PeopleTranslations:DisabledEmployeeStatus"));
default:

View File

@ -498,7 +498,7 @@ const InsideGroupTableRow = (props) => {
/>
</TableCell>
<Link
<Text
type="page"
title={displayName}
fontWeight="600"
@ -514,7 +514,7 @@ const InsideGroupTableRow = (props) => {
: displayName?.trim()
? displayName
: email}
</Link>
</Text>
<Badges statusType={statusType} isPaid={isPaidUser} isSSO={isSSO} />
</TableCell>

View File

@ -501,7 +501,7 @@ const PeopleTableRow = (props) => {
/>
</TableCell>
<Link
<Text
type="page"
title={displayName}
fontWeight="600"
@ -517,7 +517,7 @@ const PeopleTableRow = (props) => {
: displayName?.trim()
? displayName
: email}
</Link>
</Text>
<Badges statusType={statusType} isPaid={isPaidUser} isSSO={isSSO} />
</TableCell>

View File

@ -787,7 +787,7 @@ const SectionFilterContent = ({
label = t("Common:Active");
break;
case EmployeeStatus.Pending:
label = t("PeopleTranslations:PendingTitle");
label = t("PeopleTranslations:PendingInviteTitle");
break;
case EmployeeStatus.Disabled:
label = t("PeopleTranslations:DisabledEmployeeStatus");
@ -1323,7 +1323,7 @@ const SectionFilterContent = ({
id: "filter_status-pending",
key: EmployeeStatus.Pending,
group: "filter-status",
label: t("PeopleTranslations:PendingTitle"),
label: t("PeopleTranslations:PendingInviteTitle"),
},
];

View File

@ -158,6 +158,7 @@ const PureHome = (props) => {
setSelectedFolder,
userId,
getFolderModel,
scrollToTop,
} = props;
const location = useLocation();
@ -198,6 +199,8 @@ const PureHome = (props) => {
gallerySelected,
folderSecurity,
userId,
scrollToTop,
});
const { showUploadPanel } = useOperations({
@ -227,6 +230,8 @@ const PureHome = (props) => {
setSelectedNode,
fetchPeople,
setPortalTariff,
scrollToTop,
});
useGroups({
@ -239,6 +244,8 @@ const PureHome = (props) => {
setSelectedNode,
fetchGroups,
scrollToTop,
});
useInsideGroup({
@ -248,6 +255,8 @@ const PureHome = (props) => {
setIsLoading,
setPortalTariff,
fetchGroup,
scrollToTop,
});
useSettings({
@ -483,6 +492,7 @@ export default inject(
addTagsToRoom,
removeTagsFromRoom,
getRooms,
scrollToTop,
} = filesStore;
const { updateProfileCulture } = peopleStore.targetUserStore;
@ -659,6 +669,7 @@ export default inject(
getRooms,
setSelectedFolder,
getFolderModel,
scrollToTop,
};
},
)(observer(Home));

View File

@ -77,7 +77,7 @@ class HeaderMenuStore {
case "active":
return t("Common:Active");
case "pending":
return t("PeopleTranslations:PendingTitle");
return t("PeopleTranslations:PendingInviteTitle");
case "disabled":
return t("PeopleTranslations:DisabledEmployeeStatus");
case "all":

View File

@ -126,6 +126,7 @@ export type TSettings = {
defaultPage?: string;
tagManagerId?: string;
enabledJoin?: boolean;
maxImageUploadSize: number;
};
export type TCustomSchema = {

View File

@ -38,10 +38,12 @@ const Dropzone = ({
t,
setUploadedFile,
isDisabled,
maxImageSize = ONE_MEGABYTE,
}: {
t: (key: string) => string;
setUploadedFile: (f: File) => void;
isDisabled?: boolean;
maxImageSize?: number;
}) => {
const [loadingFile, setLoadingFile] = useState(false);
const mount = useRef(false);
@ -84,7 +86,7 @@ const Dropzone = ({
// console.log(`${stepMessage} ${sizeMessage} ${compressionRatioMessage}`);
if (file.size < ONE_MEGABYTE) {
if (file.size < maxImageSize) {
return file;
}
@ -117,7 +119,7 @@ const Dropzone = ({
resizeRecursiveAsync(
{ width, height },
canvas,
file.size > ONE_MEGABYTE ? COMPRESSION_RATIO : NO_COMPRESSION_RATIO,
file.size > maxImageSize ? COMPRESSION_RATIO : NO_COMPRESSION_RATIO,
)
.then((f) => {
if (mount.current) {

View File

@ -24,7 +24,8 @@
// content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
export type TFunc = (key: string) => string;
import { TTranslation } from "../../types";
export type TImage = {
uploadedFile?: string | File;
zoom: number;
@ -35,7 +36,7 @@ export type TChangeImage = (image: TImage) => void;
export type TSetPreview = (preview: string) => void;
export interface ImageEditorProps {
t: TFunc;
t: TTranslation;
image: TImage;
onChangeImage: TChangeImage;
Preview: React.ReactNode;
@ -44,10 +45,11 @@ export interface ImageEditorProps {
classNameWrapperImageCropper?: string;
className?: string;
disableImageRescaling?: boolean;
maxImageSize?: number;
}
export interface ImageCropperProps {
t: TFunc;
t: TTranslation;
image: TImage;
onChangeImage: TChangeImage;
uploadedFile: File | string;

View File

@ -40,6 +40,7 @@ const ImageEditor = ({
classNameWrapperImageCropper,
className,
disableImageRescaling,
maxImageSize,
}: ImageEditorProps) => {
const setUploadedFile = (f?: File) => {
onChangeImage({ ...image, uploadedFile: f });
@ -70,6 +71,7 @@ const ImageEditor = ({
t={t}
setUploadedFile={setUploadedFile}
isDisabled={isDisabled}
maxImageSize={maxImageSize}
/>
</div>
);

View File

@ -41,7 +41,7 @@ export const enum EmployeeActivationStatus {
export const enum EmployeeStatus {
Active = 1,
Disabled = 2,
Pending = 3, // NEW STATUS from server
Pending = 4, // NEW STATUS from server
}
/**
* Enum for employee type.

View File

@ -313,6 +313,8 @@ class SettingsStore {
userNameRegex = "";
maxImageUploadSize: number | null = null;
windowWidth = window.innerWidth;
windowAngle = window.screen?.orientation?.angle ?? window.orientation ?? 0;