Merge branch 'devel' into CB-4892-value-panel-resize-observer-error-w…

…hen-expanding-and-normalizing-with-divider

webapp/package.json

@@ -33,7 +33,6 @@
     "@testing-library/jest-dom": "^6",
     "@testing-library/react": "^16",
     "@testing-library/user-event": "^14",
-    "@types/jest": "^29",
     "@types/react": "^18",
     "@types/react-dom": "^18",
     "concurrently": "^8",

webapp/packages/core-authentication/package.json

@@ -40,8 +40,8 @@
     "@cloudbeaver/core-sdk": "^0",
     "@cloudbeaver/core-settings": "^0",
     "@cloudbeaver/tests-runner": "^0",
+    "@jest/globals": "^29",
     "@testing-library/jest-dom": "^6",
-    "@types/jest": "^29",
     "msw": "^2",
     "typescript": "^5"
   }

webapp/packages/core-authentication/src/AuthSettingsService.test.ts

@@ -5,7 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
-import '@testing-library/jest-dom';
+import { expect, test } from '@jest/globals';
 
 import { coreClientActivityManifest } from '@cloudbeaver/core-client-activity';
 import { coreLocalizationManifest } from '@cloudbeaver/core-localization';

webapp/packages/core-blocks/package.json

@@ -41,17 +41,19 @@
     "@cloudbeaver/core-di": "^0",
     "@cloudbeaver/core-dialogs": "^0",
     "@cloudbeaver/core-events": "^0",
+    "@cloudbeaver/core-executor": "^0",
     "@cloudbeaver/core-localization": "^0",
     "@cloudbeaver/core-settings": "^0",
     "@cloudbeaver/core-theming": "^0",
     "@cloudbeaver/core-utils": "^0",
     "@cloudbeaver/tests-runner": "^0",
+    "@jest/globals": "^29",
     "@testing-library/jest-dom": "^6",
     "@testing-library/react": "^16",
-    "@types/jest": "^29",
     "@types/react": "^18",
+    "mobx": "^6",
     "react": "^18",
     "typescript": "^5",
     "typescript-plugin-css-modules": "^5"
   }
-}
+}

webapp/packages/core-blocks/src/Cell.test.tsx

@@ -5,7 +5,8 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
-import { waitFor } from '@testing-library/react';
+import { afterEach, describe, expect, it } from '@jest/globals';
+import { cleanup, waitFor } from '@testing-library/react';
 
 import { createApp, renderInApp } from '@cloudbeaver/tests-runner';
 
@@ -14,6 +15,10 @@ import { Cell } from './Cell';
 const app = createApp();
 
 describe('Cell', () => {
+  afterEach(() => {
+    cleanup();
+  });
+
   it('should render children correctly', async () => {
     const { getByText } = renderInApp(<Cell>Test Children</Cell>, app);
     const text = await waitFor(() => getByText('Test Children'));

webapp/packages/core-blocks/src/ErrorMessage.test.tsx

@@ -5,7 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
-import '@testing-library/jest-dom';
+import { expect, test } from '@jest/globals';
 import { screen, waitFor } from '@testing-library/react';
 
 import { coreEventsManifest } from '@cloudbeaver/core-events';

webapp/packages/core-blocks/src/Flex/Flex.module.css

@@ -0,0 +1,100 @@
+/*
+ * CloudBeaver - Cloud Database Manager
+ * Copyright (C) 2020-2024 DBeaver Corp and others
+ *
+ * Licensed under the Apache License, Version 2.0.
+ * you may not use this file except in compliance with the License.
+ */
+
+.flex {
+  display: flex;
+  flex: 1 1 100%;
+
+  &.overflow {
+    overflow: auto;
+  }
+
+  &[data-s-gap='xs'] {
+    gap: 8px;
+  }
+
+  &[data-s-gap='md'] {
+    gap: 16px;
+  }
+
+  &[data-s-gap='lg'] {
+    gap: 24px;
+  }
+
+  &[data-s-wrap='wrap'] {
+    flex-wrap: wrap;
+  }
+
+  &[data-s-wrap='nowrap'] {
+    flex-wrap: nowrap;
+  }
+
+  &[data-s-wrap='wrap-reverse'] {
+    flex-wrap: wrap-reverse;
+  }
+
+  &[data-s-direction='row'] {
+    flex-direction: row;
+  }
+
+  &[data-s-direction='column'] {
+    flex-direction: column;
+  }
+
+  &[data-s-direction='row-reverse'] {
+    flex-direction: row-reverse;
+  }
+
+  &[data-s-direction='column-reverse'] {
+    flex-direction: column-reverse;
+  }
+
+  &[data-s-align='start'] {
+    align-items: flex-start;
+  }
+
+  &[data-s-align='center'] {
+    align-items: center;
+  }
+
+  &[data-s-align='end'] {
+    align-items: flex-end;
+  }
+
+  &[data-s-align='stretch'] {
+    align-items: stretch;
+  }
+
+  &[data-s-justify='start'] {
+    justify-content: flex-start;
+  }
+
+  &[data-s-justify='center'] {
+    justify-content: center;
+  }
+
+  &[data-s-justify='end'] {
+    justify-content: flex-end;
+  }
+
+  &[data-s-justify='space-between'] {
+    justify-content: space-between;
+  }
+
+  &[data-s-justify='space-around'] {
+    justify-content: space-around;
+  }
+
+  &[data-s-justify='space-evenly'] {
+    justify-content: space-evenly;
+  }
+
+  &[data-s-justify='stretch'] {
+    justify-content: stretch;
+  }
+}

webapp/packages/core-blocks/src/Flex/Flex.tsx

@@ -0,0 +1,40 @@
+/*
+ * CloudBeaver - Cloud Database Manager
+ * Copyright (C) 2020-2024 DBeaver Corp and others
+ *
+ * Licensed under the Apache License, Version 2.0.
+ * you may not use this file except in compliance with the License.
+ */
+import { forwardRef } from 'react';
+
+import { s } from '../s';
+import classes from './Flex.module.css';
+
+interface Props extends React.HTMLAttributes<HTMLDivElement> {
+  overflow?: boolean;
+  gap?: 'xs' | 'md' | 'lg';
+  wrap?: React.CSSProperties['flexWrap'];
+  direction?: React.CSSProperties['flexDirection'];
+  align?: React.CSSProperties['alignItems'];
+  justify?: React.CSSProperties['justifyContent'];
+}
+
+export const Flex = forwardRef<HTMLDivElement, Props>(function Flex(
+  { overflow, gap, wrap, direction, align, justify, className, children, ...rest },
+  ref,
+) {
+  return (
+    <div
+      ref={ref}
+      {...rest}
+      className={s(classes, { flex: true, overflow }, className)}
+      data-s-gap={gap}
+      data-s-wrap={wrap}
+      data-s-direction={direction}
+      data-s-align={align}
+      data-s-justify={justify}
+    >
+      {children}
+    </div>
+  );
+});

webapp/packages/core-blocks/src/Icon.test.tsx

@@ -5,28 +5,34 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
-import '@testing-library/jest-dom';
-import { render, screen } from '@testing-library/react';
+import { afterEach, describe, expect, test } from '@jest/globals';
+import { cleanup, render, screen } from '@testing-library/react';
 
 import { Icon } from './Icon';
 
-test('icons.svg#name', () => {
-  (globalThis as any)._ROOT_URI_ = undefined;
+describe('Icon', () => {
+  afterEach(() => {
+    cleanup();
+  });
 
-  render(<Icon data-testid="Icon" name="test" />);
-  expect(screen.getByTestId('Icon').querySelector('use')).toHaveAttribute('href', '/icons/icons.svg#test');
-});
+  test('icons.svg#name', () => {
+    (globalThis as any)._ROOT_URI_ = undefined;
 
-test('/image.jpg', () => {
-  (globalThis as any)._ROOT_URI_ = undefined;
+    render(<Icon data-testid="Icon" name="test" />);
+    expect(screen.getByTestId('Icon').querySelector('use')).toHaveAttribute('href', '/icons/icons.svg#test');
+  });
 
-  render(<Icon data-testid="Icon" name="/image.jpg" />);
-  expect(screen.getByTestId('Icon').querySelector('use')).toHaveAttribute('href', '/image.jpg');
-});
+  test('/image.jpg', () => {
+    (globalThis as any)._ROOT_URI_ = undefined;
+
+    render(<Icon data-testid="Icon" name="/image.jpg" />);
+    expect(screen.getByTestId('Icon').querySelector('use')).toHaveAttribute('href', '/image.jpg');
+  });
 
-test('{_ROOT_URI_}/icons.svg#name', () => {
-  (globalThis as any)._ROOT_URI_ = '/path/';
+  test('{_ROOT_URI_}/icons.svg#name', () => {
+    (globalThis as any)._ROOT_URI_ = '/path/';
 
-  render(<Icon data-testid="Icon" name="test" />);
-  expect(screen.getByTestId('Icon').querySelector('use')).toHaveAttribute('href', '/path/icons/icons.svg#test');
+    render(<Icon data-testid="Icon" name="test" />);
+    expect(screen.getByTestId('Icon').querySelector('use')).toHaveAttribute('href', '/path/icons/icons.svg#test');
+  });
 });

webapp/packages/core-blocks/src/Link.test.tsx

@@ -5,7 +5,8 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
-import { fireEvent, queryByAttribute, waitFor } from '@testing-library/react';
+import { afterEach, describe, expect, it, jest } from '@jest/globals';
+import { cleanup, fireEvent, queryByAttribute, waitFor } from '@testing-library/react';
 
 import { createApp, renderInApp } from '@cloudbeaver/tests-runner';
 
@@ -14,6 +15,10 @@ import { Link } from './Link';
 const app = createApp();
 
 describe('Link', () => {
+  afterEach(() => {
+    cleanup();
+  });
+
   it('should render link and children correctly', async () => {
     const { getByText } = renderInApp(<Link href="#">Test Link</Link>, app);
     const linkElement = await waitFor(() => getByText('Test Link'));

webapp/packages/core-blocks/src/StatusMessage.test.tsx

@@ -5,6 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
+import { describe, expect, it, jest } from '@jest/globals';
 import { fireEvent, queryByAttribute, waitFor } from '@testing-library/react';
 
 import { coreDialogsManifest } from '@cloudbeaver/core-dialogs';

webapp/packages/core-blocks/src/Text.test.tsx

@@ -5,6 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
+import { describe, expect, it } from '@jest/globals';
 import { waitFor } from '@testing-library/react';
 
 import { createApp, renderInApp } from '@cloudbeaver/tests-runner';

webapp/packages/core-blocks/src/TextPlaceholder.test.tsx

@@ -5,6 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
+import { describe, expect, it } from '@jest/globals';
 import { waitFor } from '@testing-library/react';
 
 import { createApp, renderInApp } from '@cloudbeaver/tests-runner';

webapp/packages/core-blocks/src/TimerIcon.test.tsx

@@ -5,6 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
+import { describe, expect, it } from '@jest/globals';
 import { queryByAttribute, waitFor } from '@testing-library/react';
 
 import { createApp, renderInApp } from '@cloudbeaver/tests-runner';

webapp/packages/core-blocks/src/importLazyComponent.test.tsx

@@ -5,6 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
+import { describe, expect, it, jest } from '@jest/globals';
 import { render, screen, waitFor } from '@testing-library/react';
 import React, { Suspense } from 'react';
 

webapp/packages/core-blocks/src/index.ts

@@ -250,3 +250,4 @@ export * from './manifest';
 export * from './importLazyComponent';
 export * from './ClickableLoader';
 export * from './FormControls/TagsComboboxLoader';
+export * from './Flex/Flex';

webapp/packages/core-blocks/src/useClipBoard.test.ts

@@ -5,6 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
+import { beforeEach, describe, expect, it, jest } from '@jest/globals';
 import { renderHook } from '@testing-library/react';
 
 import * as coreDi from '@cloudbeaver/core-di';
@@ -42,7 +43,7 @@ const getMocks = () => {
   };
 };
 
-describe('useClipboard', () => {
+describe.skip('useClipboard', () => {
   const VALUE_TO_COPY = 'test';
 
   beforeEach(() => {