Merge branch 'release/rc-v1.2.0' into feature/ctrl-select

2023-01-16 20:49:20 +03:00 · 2023-01-16 20:49:20 +03:00 · cbf2dc1bcb
commit cbf2dc1bcb
parent 2d06eff8e8 aa6ed73f61
23 changed files with 183 additions and 112 deletions
--- a/packages/client/public/locales/en/CreateEditRoomDialog.json
+++ b/packages/client/public/locales/en/CreateEditRoomDialog.json
@ -21,9 +21,8 @@
  "TagsPlaceholder": "Add a tag",
  "ThirdPartyStorageComboBoxPlaceholder": "Select storage",
  "ThirdPartyStorageDescription": "Use third-party services as data storage for this room. A new folder for storing this room’s data will be created in the connected storage",
-  "ThirdPartyStorageNoStorageAlert": "No storage is connected in the DocSpace Settings. Go to the Integration section to enable data storage in a third-party service",
+  "ThirdPartyStorageNoStorageAlert": "Before, you need to connect the corresponding service in the “Integration” section. Otherwise, the connection will not be possible.",
  "ThirdPartyStoragePermanentSettingDescription": "Files are stored in a third-party {{thirdpartyTitle}} storage in the \"{{thirdpartyFolderName}}\" folder.\n<strong>{{thirdpartyPath}}</strong>",
-  "ThirdPartyStorageRememberChoice": "Remember this choice for new rooms",
  "ThirdPartyStorageTitle": "Third-party storage",
  "ViewOnlyRoomDescription": "Share any ready documents, reports, documentation, and other files for viewing",
  "ViewOnlyRoomTitle": "View-only room"
--- a/packages/client/public/locales/en/Settings.json
+++ b/packages/client/public/locales/en/Settings.json
@ -182,7 +182,6 @@
  "ThirdPartyResourceDescription": "Backup can be saved to your third-party account (Dropbox, Box.com, OneDrive or Google Drive). You need to connect your third-party account (Dropbox, Box.com, OneDrive or Google Drive) before you will be able to save your backup there.",
  "ThirdPartyStorage": "Third-party storage",
  "ThirdPartyStorageDescription": "Backup can be saved to a third-party storage. Before, you need to connect the corresponding service in the 'Integration' section. Otherwise, the following settings will be inactive.",
-  "ThirdPartyTitle": "Third-party services",
  "ThirdPartyTitleDescription": "With Authorization keys, you can connect third-party services to your space. Sign in easily with Facebook, Twitter, or LinkedIn. Add Dropbox, OneDrive, and other accounts to work with files stored there.",
  "TimeZone": "Time zone",
  "TrustedMail": "Trusted mail domain settings",
--- a/packages/client/public/locales/en/Translations.json
+++ b/packages/client/public/locales/en/Translations.json
@ -59,6 +59,7 @@
  "SubNewForm": "Blank",
  "SubNewFormFile": "From text file",
  "ThirdPartyInfo": "Change the third-party info",
+  "ThirdPartyTitle": "Third-party services",
  "TitleShowActions": "Show File Actions",
  "TitleShowFolderActions": "Show Folder Actions",
  "TypeTitleBoxNet": "Box",
--- a/packages/client/public/locales/ru/CreateEditRoomDialog.json
+++ b/packages/client/public/locales/ru/CreateEditRoomDialog.json
@ -21,9 +21,8 @@
  "TagsPlaceholder": "Добавьте тэг",
  "ThirdPartyStorageComboBoxPlaceholder": "Выберите хранилище",
  "ThirdPartyStorageDescription": "Используйте сторонние сервисы в качестве хранилища данных для этой комнаты. В подключенном хранилище будет создана новая папка для хранения данных этой комнаты",
-  "ThirdPartyStorageNoStorageAlert": "В Настройках портала не подключено ни одного хранилища. Перейдите в раздел Интеграций, чтобы включить возможность хранения данных на стороннем сервисе ",
+  "ThirdPartyStorageNoStorageAlert": "Предварительно необходимо подключить соответствующую услугу в разделе «Интеграция». В противном случае подключение будет невозможно.",
  "ThirdPartyStoragePermanentSettingDescription": "Файлы хранятся в стороннем хранилище {{thirdpartyTitle}} в папке \"{{thirdpartyFolderName}}\".\n<strong>{{thirdpartyPath}}</strong>",
-  "ThirdPartyStorageRememberChoice": "Запомнить этот выбор для новых комнат",
  "ThirdPartyStorageTitle": "Место хранения",
  "ViewOnlyRoomDescription": "Предоставляйте доступ к любым готовым документам, отчетам, документации и другим файлам для просмотра",
  "ViewOnlyRoomTitle": "Комната для просмотра"
--- a/packages/client/public/locales/ru/FilesSettings.json
+++ b/packages/client/public/locales/ru/FilesSettings.json
@ -10,6 +10,7 @@
  "OriginalCopy": "Сохранять также копию файла в исходном формате",
  "StoringFileVersion": "Хранение версий файлов",
  "ThirdPartyAccounts": "Сторонние аккаунты",
+  "ThirdPartyBtn": "Разрешить администраторам комнаты подключать сторонние хранилища",
  "UpdateOrCreate": "Обновлять версию файла для существующего файла с таким же именем. В противном случае будет создаваться копия файла.",
  "UploadPluginsHere": "Загрузите плагины сюда"
 }
--- a/packages/client/public/locales/ru/Settings.json
+++ b/packages/client/public/locales/ru/Settings.json
@ -182,7 +182,6 @@
  "ThirdPartyResourceDescription": "Резервную копию можно сохранить в сторонний аккаунт (Dropbox, Box.com, OneDrive или Google Drive). Вам необходимо подключить свою стороннюю учетную запись (Dropbox, Box.com, OneDrive или Google Drive), прежде чем вы сможете сохранить там свою резервную копию.",
  "ThirdPartyStorage": "Стороннее хранилище",
  "ThirdPartyStorageDescription": "Резервная копия может быть сохранена на стороннем хранилище. Соответствующий сервис необходимо предварительно подключить в разделе 'Интеграция'. В противном случае указанные ниже настройки будут неактивны.",
-  "ThirdPartyTitle": "Сторонние сервисы",
  "ThirdPartyTitleDescription": "Ключи авторизации позволяют подключить портал к сторонним сервисам. Подключите портал к Facebook, Twitter или LinkedIn, если Вы не хотите каждый раз при входе вводить свои учетные данные на портале. Привяжите портал к таким сервисам, как Dropbox, OneDrive и т.д. чтобы перенести документы из всех этих хранилищ в модуль Документы.",
  "TimeZone": "Часовой пояс",
  "TrustedMail": "Настройки доверенных почтовых доменов",
--- a/packages/client/public/locales/ru/Translations.json
+++ b/packages/client/public/locales/ru/Translations.json
@ -59,6 +59,7 @@
  "SubNewForm": "Пустая",
  "SubNewFormFile": "Из текстового файла",
  "ThirdPartyInfo": "Изменить настройки подключения",
+  "ThirdPartyTitle": "Сторонние сервисы",
  "TitleShowActions": "Показать действия над файлом",
  "TitleShowFolderActions": "Показать действия над папкой",
  "TypeTitleBoxNet": "Box",
--- a/packages/client/src/components/EmptyContainer/EmptyFilterContainer.js
+++ b/packages/client/src/components/EmptyContainer/EmptyFilterContainer.js
@ -16,6 +16,9 @@ const EmptyFilterContainer = ({
  fetchRooms,
  linkStyles,
  isRooms,
+  isArchiveFolder,
+  isRoomsFolder,
+  setClearSearch,
 }) => {
  const subheadingText = t("EmptyFilterSubheadingText");
  const descriptionText = isRooms
@ -24,7 +27,13 @@ const EmptyFilterContainer = ({

  const onResetFilter = () => {
    setIsLoading(true);
-    if (isRooms) {
+
+    if (isArchiveFolder) {
+      setClearSearch(true);
+      return;
+    }
+
+    if (isRoomsFolder) {
      const newFilter = RoomsFilter.getDefault();
      fetchRooms(selectedFolderId, newFilter)
        .catch((err) => toastr.error(err))
@ -74,6 +83,9 @@ export default inject(
      selectedFolderId: selectedFolderStore.id,
      setIsLoading: filesStore.setIsLoading,
      isRooms,
+      isArchiveFolder,
+      isRoomsFolder,
+      setClearSearch: filesStore.setClearSearch,
    };
  }
 )(withTranslation(["Files", "Common"])(observer(EmptyFilterContainer)));
--- a/packages/client/src/components/GlobalEvents/CreateRoomEvent.js
+++ b/packages/client/src/components/GlobalEvents/CreateRoomEvent.js
@ -30,6 +30,8 @@ const CreateRoomEvent = ({
  fetchFiles,
  setInfoPanelIsVisible,
  setView,
+  isAdmin,
+  enableThirdParty,
 }) => {
  const { t } = useTranslation(["CreateEditRoomDialog", "Common", "Files"]);
  const [fetchedTags, setFetchedTags] = useState([]);
@ -142,6 +144,8 @@ const CreateRoomEvent = ({
      setIsLoading={setIsLoading}
      deleteThirdParty={deleteThirdParty}
      fetchThirdPartyProviders={fetchThirdPartyProviders}
+      isAdmin={isAdmin}
+      enableThirdParty={enableThirdParty}
    />
  );
 };
@ -184,6 +188,10 @@ export default inject(
      setView,
    } = auth.infoPanelStore;

+    const { isAdmin } = auth;
+
+    const { enableThirdParty } = settingsStore;
+
    return {
      createRoom,
      createRoomInThirdpary,
@ -205,6 +213,8 @@ export default inject(
      fetchFiles,
      setInfoPanelIsVisible,
      setView,
+      isAdmin,
+      enableThirdParty,
    };
  }
 )(observer(CreateRoomEvent));
--- a/packages/client/src/components/dialogs/ChangeNameDialog/index.js
+++ b/packages/client/src/components/dialogs/ChangeNameDialog/index.js
@ -34,6 +34,10 @@ const ChangeNameDialog = (props) => {
    }
  };

+  const onKeyDown = (e) => {
+    if (e.keyCode === 13 || e.which === 13) onSaveClick();
+  };
+
  const onSaveClick = async () => {
    const newProfile = profile;
    newProfile.firstName = firstName;
@ -76,6 +80,8 @@ const ChangeNameDialog = (props) => {
            onChange={(e) => setFirstName(e.target.value)}
            placeholder={t("Common:FirstName")}
            isDisabled={isSaving}
+            onKeyDown={onKeyDown}
+            tabIndex={1}
          />
        </FieldContainer>

@ -90,6 +96,8 @@ const ChangeNameDialog = (props) => {
            onChange={(e) => setLastName(e.target.value)}
            placeholder={t("Common:LastName")}
            isDisabled={isSaving}
+            onKeyDown={onKeyDown}
+            tabIndex={2}
          />
        </FieldContainer>
      </ModalDialog.Body>
@ -102,6 +110,7 @@ const ChangeNameDialog = (props) => {
          primary={true}
          onClick={onSaveClick}
          isLoading={isSaving}
+          tabIndex={3}
        />
        <Button
          key="CloseBtn"
@ -110,6 +119,7 @@ const ChangeNameDialog = (props) => {
          scale
          onClick={onClose}
          isDisabled={isSaving}
+          tabIndex={4}
        />
      </ModalDialog.Footer>
    </ModalDialogContainer>
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/CreateRoomDialog.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/CreateRoomDialog.js
@ -39,6 +39,8 @@ const CreateRoomDialog = ({

  deleteThirdParty,
  fetchThirdPartyProviders,
+  isAdmin,
+  enableThirdParty,
 }) => {
  const [isScrollLocked, setIsScrollLocked] = useState(false);
  const [isOauthWindowOpen, setIsOauthWindowOpen] = useState(false);
@ -150,6 +152,8 @@ const CreateRoomDialog = ({
            isDisabled={isLoading}
            isValidTitle={isValidTitle}
            setIsValidTitle={setIsValidTitle}
+            isAdmin={isAdmin}
+            enableThirdParty={enableThirdParty}
          />
        )}
      </ModalDialog.Body>
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/SetRoomParams.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/SetRoomParams.js
@ -45,6 +45,8 @@ const SetRoomParams = ({
  isDisabled,
  isValidTitle,
  setIsValidTitle,
+  isAdmin,
+  enableThirdParty,
 }) => {
  const [previewIcon, setPreviewIcon] = React.useState(null);

@ -112,7 +114,7 @@ const SetRoomParams = ({
        />
      )} */}

-      {!isEdit && (
+      {!isEdit && (enableThirdParty || isAdmin) && (
        <ThirdPartyStorage
          t={t}
          roomTitle={roomParams.title}
@ -149,6 +151,6 @@ const SetRoomParams = ({
  );
 };

-export default withTranslation(["CreateEditRoomDialog"])(
+export default withTranslation(["CreateEditRoomDialog", "Translations"])(
  withLoader(SetRoomParams)(<Loaders.SetRoomParamsLoader />)
 );
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/ThirdPartyStorage/index.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/ThirdPartyStorage/index.js
@ -7,7 +7,8 @@ import { StyledParam } from "../Params/StyledParam";
 import ToggleParam from "../Params/ToggleParam";
 import ThirdPartyComboBox from "./ThirdPartyComboBox";

-import Checkbox from "@docspace/components/checkbox";
+import Link from "@docspace/components/link";
+import Text from "@docspace/components/text";
 import FolderInput from "./FolderInput";
 import { getOAuthToken } from "@docspace/common/utils";

@ -38,6 +39,7 @@ const ThirdPartyStorage = ({
  getOAuthToken,

  isDisabled,
+  currentColorScheme,
 }) => {
  const onChangeIsThirdparty = () => {
    if (isDisabled) return;
@ -48,10 +50,17 @@ const ThirdPartyStorage = ({
      });
    } else {
      toastr.warning(
-        <div>
-          <div>{t("ThirdPartyStorageNoStorageAlert")}</div>
-          <a href="#">Third-party services</a>
-        </div>,
+        <Text as="p">
+          {t("ThirdPartyStorageNoStorageAlert")}{" "}
+          <Link
+            href="/portal-settings/integration/third-party-services"
+            type="page"
+            noHover
+            color={currentColorScheme.main.accent}
+          >
+            {t("Translations:ThirdPartyTitle")}
+          </Link>
+        </Text>,
        null,
        5000,
        true,
@ -80,13 +89,6 @@ const ThirdPartyStorage = ({
      storageFolderId,
    });

-  const onChangeIsSaveThirdpartyAccount = () => {
-    onChangeStorageLocation({
-      ...storageLocation,
-      rememberThirdpartyStorage: !storageLocation.rememberThirdpartyStorage,
-    });
-  };
-
  return (
    <StyledThirdPartyStorage>
      <ToggleParam
@ -127,94 +129,77 @@ const ThirdPartyStorage = ({
          isDisabled={isDisabled}
        />
      )}
-
-      {/* {storageLocation.isThirdparty && storageLocation.thirdpartyAccount && (
-        <Checkbox
-          className="thirdparty-checkbox"
-          label={t("ThirdPartyStorageRememberChoice")}
-          isChecked={storageLocation.isSaveThirdpartyAccount}
-          onChange={onChangeIsSaveThirdpartyAccount}
-        />
-      )} */}
    </StyledThirdPartyStorage>
  );
 };

-export default inject(
-  ({
-    auth,
-    filesStore,
-    tagsStore,
-    filesActionsStore,
-    selectedFolderStore,
-    settingsStore,
-    dialogsStore,
-  }) => {
-    // const { getOAuthToken } = auth.settingsStore;
-    const {
-      openConnectWindow,
-      saveThirdParty,
-      deleteThirdParty,
-    } = settingsStore.thirdPartyStore;
+export default inject(({ auth, settingsStore, dialogsStore }) => {
+  const { currentColorScheme } = auth.settingsStore;

-    const {
-      setConnectItem,
-      setConnectDialogVisible,
-      setRoomCreation,
-      saveThirdpartyResponse,
-      setSaveThirdpartyResponse,
-    } = dialogsStore;
+  const {
+    openConnectWindow,
+    saveThirdParty,
+    deleteThirdParty,
+  } = settingsStore.thirdPartyStore;

-    const thirdPartyStore = settingsStore.thirdPartyStore;
+  const {
+    setConnectItem,
+    setConnectDialogVisible,
+    setRoomCreation,
+    saveThirdpartyResponse,
+    setSaveThirdpartyResponse,
+  } = dialogsStore;

-    const connectItems = [
-      thirdPartyStore.googleConnectItem,
-      thirdPartyStore.boxConnectItem,
-      thirdPartyStore.dropboxConnectItem,
-      thirdPartyStore.oneDriveConnectItem,
-      thirdPartyStore.nextCloudConnectItem && [
-        ...thirdPartyStore.nextCloudConnectItem,
-        "Nextcloud",
-      ],
-      thirdPartyStore.kDriveConnectItem,
-      thirdPartyStore.yandexConnectItem,
-      thirdPartyStore.ownCloudConnectItem && [
-        ...thirdPartyStore.ownCloudConnectItem,
-        "ownCloud",
-      ],
-      thirdPartyStore.webDavConnectItem,
-      thirdPartyStore.sharePointConnectItem,
-    ]
-      .map(
-        (item) =>
-          item && {
-            id: item[0],
-            className: `storage_${item[0].toLowerCase()}`,
-            providerKey: item[0],
-            isOauth: item.length > 1 && item[0] !== "WebDav",
-            oauthHref: item.length > 1 && item[0] !== "WebDav" ? item[1] : "",
-            ...(item[0] === "WebDav" && {
-              category: item[item.length - 1],
-            }),
-          }
-      )
-      .filter((item) => !!item);
+  const thirdPartyStore = settingsStore.thirdPartyStore;

-    return {
-      connectItems,
+  const connectItems = [
+    thirdPartyStore.googleConnectItem,
+    thirdPartyStore.boxConnectItem,
+    thirdPartyStore.dropboxConnectItem,
+    thirdPartyStore.oneDriveConnectItem,
+    thirdPartyStore.nextCloudConnectItem && [
+      ...thirdPartyStore.nextCloudConnectItem,
+      "Nextcloud",
+    ],
+    thirdPartyStore.kDriveConnectItem,
+    thirdPartyStore.yandexConnectItem,
+    thirdPartyStore.ownCloudConnectItem && [
+      ...thirdPartyStore.ownCloudConnectItem,
+      "ownCloud",
+    ],
+    thirdPartyStore.webDavConnectItem,
+    thirdPartyStore.sharePointConnectItem,
+  ]
+    .map(
+      (item) =>
+        item && {
+          id: item[0],
+          className: `storage_${item[0].toLowerCase()}`,
+          providerKey: item[0],
+          isOauth: item.length > 1 && item[0] !== "WebDav",
+          oauthHref: item.length > 1 && item[0] !== "WebDav" ? item[1] : "",
+          ...(item[0] === "WebDav" && {
+            category: item[item.length - 1],
+          }),
+        }
+    )
+    .filter((item) => !!item);

-      setConnectDialogVisible,
-      setRoomCreation,
+  return {
+    connectItems,

-      saveThirdParty,
-      deleteThirdParty,
+    setConnectDialogVisible,
+    setRoomCreation,

-      saveThirdpartyResponse,
-      setSaveThirdpartyResponse,
+    saveThirdParty,
+    deleteThirdParty,

-      openConnectWindow,
-      setConnectItem,
-      getOAuthToken,
-    };
-  }
-)(observer(ThirdPartyStorage));
+    saveThirdpartyResponse,
+    setSaveThirdpartyResponse,
+
+    openConnectWindow,
+    setConnectItem,
+    getOAuthToken,
+    currentColorScheme,
+  };
+})(observer(ThirdPartyStorage));
--- a/packages/client/src/pages/Home/Section/Filter/index.js
+++ b/packages/client/src/pages/Home/Section/Filter/index.js
@ -169,6 +169,8 @@ const SectionFilterContent = ({
  searchTitleOpenLocation,
  isLoadedLocationFiles,
  setIsLoadedSearchFiles,
+  clearSearch,
+  setClearSearch,
 }) => {
  const [selectedFilterValues, setSelectedFilterValues] = React.useState(null);

@ -1323,6 +1325,8 @@ const SectionFilterContent = ({
      removeSelectedItem={removeSelectedItem}
      clearAll={clearAll}
      filterTitle={t("Filter")}
+      clearSearch={clearSearch}
+      setClearSearch={setClearSearch}
    />
  );
 };
@ -1347,6 +1351,8 @@ export default inject(
      createThumbnails,
      setCurrentRoomsFilter,
      thirdPartyStore,
+      clearSearch,
+      setClearSearch,
    } = filesStore;

    const { providers } = thirdPartyStore;
@ -1404,6 +1410,9 @@ export default inject(
      setSearchTitleOpenLocation,
      isLoadedLocationFiles,
      setIsLoadedSearchFiles,
+
+      clearSearch,
+      setClearSearch,
    };
  }
 )(
--- a/packages/client/src/pages/Home/Section/Header/index.js
+++ b/packages/client/src/pages/Home/Section/Header/index.js
@ -675,6 +675,7 @@ class SectionHeaderContent extends React.Component {
                headerMenu={headerMenu}
                isInfoPanelVisible={isInfoPanelVisible}
                toggleInfoPanel={this.onToggleInfoPanel}
+                isMobileView={isMobileOnly}
              />
            ) : (
              <div className="header-container">
--- a/packages/client/src/pages/PortalSettings/categories/integration/index.js
+++ b/packages/client/src/pages/PortalSettings/categories/integration/index.js
@ -40,7 +40,7 @@ const IntegrationWrapper = (props) => {
    },
    {
      id: "third-party-services",
-      name: t("ThirdPartyTitle"),
+      name: t("Translations:ThirdPartyTitle"),
      content: <ThirdParty />,
    },
  ];
@ -91,7 +91,7 @@ export default inject(({ setup, auth }) => {
    enablePlugins,
  };
 })(
-  withTranslation(["Settings", "SingleSignOn"])(
+  withTranslation(["Settings", "SingleSignOn", "Translations"])(
    withRouter(observer(IntegrationWrapper))
  )
 );
--- a/packages/client/src/store/FilesStore.js
+++ b/packages/client/src/store/FilesStore.js
@ -111,6 +111,8 @@ class FilesStore {
  roomsController = null;
  filesController = null;

+  clearSearch = false;
+
  constructor(
    authStore,
    selectedFolderStore,
@ -355,6 +357,10 @@ class FilesStore {
    this.operationAction = operationAction;
  };

+  setClearSearch = (clearSearch) => {
+    this.clearSearch = clearSearch;
+  };
+
  updateSelectionStatus = (id, status, isEditing) => {
    const index = this.selection.findIndex((x) => x.id === id);

--- a/packages/common/components/FilterInput/index.js
+++ b/packages/common/components/FilterInput/index.js
@ -43,7 +43,10 @@ const FilterInput = React.memo(
    isPersonalRoom,
    isRooms,
    isAccounts,
-    filterTitle
+    filterTitle,
+
+    clearSearch,
+    setClearSearch,
  }) => {
    const [viewSettings, setViewSettings] = React.useState([]);
    const [inputValue, setInputValue] = React.useState("");
@ -58,6 +61,14 @@ const FilterInput = React.memo(
      if (value) setViewSettings(value);
    }, [getViewSettingsData]);

+    React.useEffect(() => {
+      if (clearSearch) {
+        setInputValue("");
+        onClearSearch();
+        setClearSearch(false);
+      }
+    }, [clearSearch]);
+
    React.useEffect(() => {
      const value = getSelectedInputValue && getSelectedInputValue();

--- a/packages/components/combobox/index.js
+++ b/packages/components/combobox/index.js
@ -112,6 +112,7 @@ class ComboBox extends React.Component {
      isAside,
      withBackground,
      advancedOptionsCount,
+      isMobileView,
    } = this.props;

    const { tabIndex, ...props } = this.props;
@ -210,6 +211,7 @@ class ComboBox extends React.Component {
            withBackdrop={withBackdrop}
            isAside={isAside}
            withBackground={withBackground}
+            isMobileView={isMobileView && !disableMobileView}
          >
            {advancedOptions
              ? advancedOptions
--- a/packages/components/drop-down/index.js
+++ b/packages/components/drop-down/index.js
@ -242,7 +242,13 @@ class DropDown extends React.PureComponent {
  };

  renderDropDown() {
-    const { maxHeight, children, showDisabledItems, theme } = this.props;
+    const {
+      maxHeight,
+      children,
+      showDisabledItems,
+      theme,
+      isMobileView,
+    } = this.props;
    const { directionX, directionY, width, manualY } = this.state;

    let cleanChildren = children;
@ -268,6 +274,7 @@ class DropDown extends React.PureComponent {
        manualY={manualY}
        isExternalLink={this.props.isExternalLink}
        isPersonal={this.props.isPersonal}
+        isMobileView={isMobileView}
        {...dropDownMaxHeightProp}
      >
        {maxHeight ? (
--- a/packages/components/drop-down/styled-drop-down.js
+++ b/packages/components/drop-down/styled-drop-down.js
@ -79,6 +79,17 @@ const StyledDropdown = styled.div`
  &.download-dialog-dropDown {
    margin-top: 4px;
  }
+
+  @media (orientation: portrait) {
+    ${(props) =>
+      props.isMobileView &&
+      css`
+        top: auto !important;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+      `}
+  }
 `;

 StyledDropdown.defaultProps = { theme: Base };
--- a/packages/components/table-container/TableGroupMenu.js
+++ b/packages/components/table-container/TableGroupMenu.js
@ -22,6 +22,7 @@ const TableGroupMenu = (props) => {
    isInfoPanelVisible,
    toggleInfoPanel,
    withoutInfoPanelToggler,
+    isMobileView,
    ...rest
  } = props;
  const onCheckboxChange = (e) => {
@ -54,6 +55,7 @@ const TableGroupMenu = (props) => {
          manualY="42px"
          manualX="-32px"
          title={t("Common:TitleSelectFile")}
+          isMobileView={isMobileView}
        />
        <div className="table-container_group-menu-separator" />
        <StyledScrollbar>
--- a/packages/components/utils/globalColors.js
+++ b/packages/components/utils/globalColors.js
@ -47,15 +47,15 @@ const globalColors = {
  warningColor: "#f1ca92",
  red: "#c30",
  darkRed: "#A60000",
-  activeSuccess: "#CAE796",
-  activeError: "#FFBFAA",
-  activeInfo: "#F1DA92",
-  activeWarning: "#F1CA92",
+  activeSuccess: "#E3F7BE",
+  activeError: "#F7CDBE",
+  activeInfo: "#F8F7BF",
+  activeWarning: "#F7E6BE",

-  hoverSuccess: "#BCDF7E",
-  hoverError: "#FFA98D",
-  hoverInfo: "#EED27B",
-  hoverWarning: "#EEB97B",
+  hoverSuccess: "#E3F7BE",
+  hoverError: "#F7CDBE",
+  hoverInfo: "#F8F7BF",
+  hoverWarning: "#F7E6BE",
 };

 export default globalColors;