Cb 3555 view byte type data decoded #2256

sergeyteleshev · 2023-12-26T13:48:13Z

I removed html/xml/json tabs for blobs. it seems redundant for me cause it basically shows the same thing as the "text" tab

I also decided not to go with BinaryValue entity and use TextValue entity due to the fact base64 and hex are a texts and there are less duplicated code

…ll correctly working props

devnaumov · 2023-12-27T17:19:36Z

webapp/packages/plugin-data-viewer/src/locales/en.ts

@@ -28,6 +28,8 @@ export default [
  ['data_viewer_presentation_value_text_html_title', 'HTML'],
  ['data_viewer_presentation_value_text_xml_title', 'XML'],
  ['data_viewer_presentation_value_text_json_title', 'JSON'],
+  ['data_viewer_presentation_value_text_hex_title', 'HEX'],


No need to add these to locales

why? all other tabs has locales, it should be consistent, I believe

devnaumov · 2023-12-27T17:20:30Z

...lugin-data-viewer/src/ValuePanelPresentation/ImageValue/isImageValuePresentationAvailable.ts

@@ -0,0 +1,20 @@
+import { getMIME, isImageFormat, isValidUrl } from '@cloudbeaver/core-utils';


License text here and below

devnaumov · 2023-12-27T17:49:17Z

...es/plugin-data-viewer/src/ValuePanelPresentation/TextValue/TextValuePresentationBootstrap.ts

    });
    this.textValuePresentationService.add({
      key: 'application/json',
      name: 'data_viewer_presentation_value_text_json_title',
      order: Number.MAX_SAFE_INTEGER,
      panel: () => React.Fragment,
+      isHidden: (_, context) => isBlobPresentationAvailable(context),


fixed here:
56333d5

devnaumov · 2023-12-27T17:55:37Z

webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/useAutoFormat.ts

@@ -25,6 +28,20 @@ export function useAutoFormat() {
          return value;
        }
      },
+      async formatBlob(type: string, value: IResultSetContentValue) {


seems like we dont "await" anything here

devnaumov · 2023-12-27T18:01:00Z

webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/useTextValue.ts

+  const [value, setValue] = useState<string>('');
+  const firstSelectedCell = selection.elements?.[0] ?? focusCell;
+  const autoFormat = !!firstSelectedCell && !editor.isElementEdited(firstSelectedCell);
+


Do wee need to use useEffect here?

const candidate = format.get(firstSelectedCell); if (isResultSetContentValue(candidate)) { return formatter.formatBlob(currentContentType, candidate); } return formatter.format(currentContentType, format.getText(firstSelectedCell))

Also seems like a lot of initialization logic is here but its not in use until autoFormat is true

removed it, thanks!

Wroud · 2023-12-28T05:38:54Z

webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/useTextValue.ts

+import type { IDatabaseResultSet } from '../../DatabaseDataModel/IDatabaseResultSet';
+import { useAutoFormat } from './useAutoFormat';
+
+type Props = {


Please use interfaces

Wroud · 2023-12-28T05:42:00Z

webapp/packages/core-utils/src/base64ToHex.ts

+export function base64ToHex(base64String: string): string {
+  const raw = atob(base64String);
+  let result = '';
+  for (let i = 0; i < raw.length; i++) {
+    const hex = raw.charCodeAt(i).toString(16);
+    result += hex.length === 2 ? hex : `0${hex}`;
+  }
+  return result.toUpperCase();
+}


This function is synchronous and will lead to thread blocking and memory consumption. Please be careful with use cases for this function and verify that in the value panel it can handle max binary value without lags.

I tried do upload a video and the interface shows that only limited size is allowed. On this limited size feature works just fine. I added a comment to this helper so we use it carefully. Maybe when we need it we can make worker do the calculations in its own thread so the main thread do not freeze or do some other event loop optimizations

This is the great notice, by the way, thanks!

Wroud · 2023-12-28T05:46:21Z

webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/useTextValue.ts

+    if (isResultSetContentValue(candidate)) {
+      formatter.formatBlob(currentContentType, candidate).then(data => {
+        data && setValue(data);
+      });
+      return;
+    }
+
+    setValue(formatter.format(currentContentType, format.getText(firstSelectedCell)));


This code is unstable, imagine that you selected big value and then before promise resolved you selected another one that is not content value. This will lead to set outdated data.

Also please don't use a && b() construction at all. Please don't use a && b constructions in not inline context.

Wroud · 2023-12-28T05:51:09Z

webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/useTextValue.ts

+  const firstSelectedCell = selection.elements?.[0] ?? focusCell;
+  const autoFormat = !!firstSelectedCell && !editor.isElementEdited(firstSelectedCell);
+
+  useEffect(() => {


Here we probably want something like this:

const cellValue = ...; const formattedValue = useMemo(() => format(cellValue), [cellValue]);

It's main idea you can rewrite it. The main goal here is to sync cellValue and formattedValue and prevent cases when wrong formattedValue displayed. (For example we switched cells fast or cell value updated)

the hook is fully synchronous right now so it has more predictable behaviour excluding fast cell switching

.../plugin-data-viewer/src/ValuePanelPresentation/TextValue/isTextValuePresentationAvailable.ts

s.teleshev added 3 commits December 26, 2023 14:13

CB-3555 isImageValuePresentationAvailable

e960125

CB-3555 fix: add proper interfaces to TextValuePresentation tab has a…

a9d1d42

…ll correctly working props

CB-3555 feat: add hex and base64 tabs

c671532

sergeyteleshev self-assigned this Dec 26, 2023

s.teleshev added 6 commits December 27, 2023 10:40

Merge branch 'devel' into CB-3555-view-byte-type-data-decoded

5041798

CB-3555 :feat adds format blob to string helpers

da0ea15

CB-3555 fix: show base64/hex in blobs only

b5f884e

CB-3555 feat: hex/base64 tabs shows content correctly

046a540

CB-3555 hide html/xml/json tabs for blob value panel

3557e54

CB-3555 use auto format cleanup

b921007

sergeyteleshev requested review from Wroud and devnaumov and removed request for Wroud December 27, 2023 13:11

devnaumov requested changes Dec 27, 2023

View reviewed changes

Wroud requested changes Dec 28, 2023

View reviewed changes

s.teleshev added 3 commits December 28, 2023 11:45

CB-3555 code cleanup

7a14f90

CB-3555 fix: json columns shows correctly

56333d5

CB-3555 useTextValue cleanup

0faf4f7

sergeyteleshev requested review from Wroud and devnaumov December 28, 2023 11:04

s.teleshev added 2 commits December 28, 2023 13:28

Merge branch 'devel' into CB-3555-view-byte-type-data-decoded

b865948

CB-3555 add licenses

82fa392

Wroud approved these changes Dec 29, 2023

View reviewed changes

.../plugin-data-viewer/src/ValuePanelPresentation/TextValue/isTextValuePresentationAvailable.ts Outdated Show resolved Hide resolved

s.teleshev and others added 2 commits December 29, 2023 11:26

CB-3555 setBinaryFileValue helper

071fec6

Merge branch 'devel' into CB-3555-view-byte-type-data-decoded

b66fce1

devnaumov approved these changes Dec 29, 2023

View reviewed changes

sergeyteleshev merged commit d6cd15c into devel Dec 29, 2023
4 checks passed

sergeyteleshev deleted the CB-3555-view-byte-type-data-decoded branch December 29, 2023 16:34

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Cb 3555 view byte type data decoded #2256

Cb 3555 view byte type data decoded #2256

sergeyteleshev commented Dec 26, 2023 •

edited

Loading

devnaumov Dec 27, 2023

sergeyteleshev Dec 28, 2023

devnaumov Dec 27, 2023

devnaumov Dec 27, 2023

sergeyteleshev Dec 28, 2023

devnaumov Dec 27, 2023

devnaumov Dec 27, 2023

sergeyteleshev Dec 28, 2023

Wroud Dec 28, 2023

Wroud Dec 28, 2023

sergeyteleshev Dec 28, 2023

Wroud Dec 28, 2023

Wroud Dec 28, 2023

sergeyteleshev Dec 28, 2023

		@@ -0,0 +1,20 @@
		import { getMIME, isImageFormat, isValidUrl } from '@cloudbeaver/core-utils';

Cb 3555 view byte type data decoded #2256

Cb 3555 view byte type data decoded #2256

Conversation

sergeyteleshev commented Dec 26, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

sergeyteleshev commented Dec 26, 2023 •

edited

Loading