feat: sdk collecting page content data (#3184)

tolgee · Jun 20, 2023 · 90b34b6 · 90b34b6
1 parent ede6d32
commit 90b34b6
Show file tree

Hide file tree

Showing 7 changed files with 669 additions and 216 deletions.
diff --git a/.github/workflows/prerelease.yml b/.github/workflows/prerelease.yml
@@ -40,7 +40,7 @@ jobs:
 
       - name: Update version locally
         run: |
-          lerna version --yes --conventional-commits --conventional-prerelease --preid prerelease.$(git rev-parse --short HEAD) \
+          lerna version prerelease --yes --conventional-commits --conventional-prerelease --preid prerelease.$(git rev-parse --short HEAD) \
             --force-publish --no-push --no-git-tag-version --exact
 
       # Set TOLGEE_UI_VERSION for @tolgee/core build
@@ -56,7 +56,7 @@ jobs:
         run: |
           git stash
           git push --follow-tags -u origin $(git rev-parse --abbrev-ref HEAD)
-          lerna version --yes --conventional-commits --conventional-prerelease --preid prerelease.$(git rev-parse --short HEAD) \
+          lerna version prerelease --yes --conventional-commits --conventional-prerelease --preid prerelease.$(git rev-parse --short HEAD) \
             --force-publish --exact --create-release github
         env:
           GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}

diff --git a/packages/web/src/observers/general/GeneralObserver.ts b/packages/web/src/observers/general/GeneralObserver.ts
@@ -161,6 +161,17 @@ export function GeneralObserver() {
     findPositions(key?: string, ns?: NsFallback) {
       const elements = instance?.elementRegistry.findAll(key, ns) || [];
       const result: KeyPosition[] = [];
+      // sort elements by their position in the dom
+      elements.sort((a, b) => {
+        if (
+          a.element.compareDocumentPosition(b.element) &
+          Node.DOCUMENT_POSITION_FOLLOWING
+        ) {
+          return -1;
+        } else {
+          return 1;
+        }
+      });
       elements.forEach((meta) => {
         const shape = meta.element.getBoundingClientRect();
         meta.nodes.forEach((node) => {

diff --git a/packages/web/src/ui/KeyDialog/dialogContext/index.ts b/packages/web/src/ui/KeyDialog/dialogContext/index.ts
@@ -16,6 +16,9 @@ import {
 } from './tools';
 import { getApiKeyType } from '../../../tools/decodeApiKey';
 import { useGallery } from './useGallery';
+import { requirePlatformVersion } from '../../tools/requirePlatformVersion';
+
+const PLATFORM_SUPPORTING_BIG_META = 'v3.20.0';
 
 type FormTranslations = {
   [key: string]: string;
@@ -140,6 +143,11 @@ export const [DialogProvider, useDialogActions, useDialogContext] =
       method: 'put',
     });
 
+    const updateMetadata = useApiMutation({
+      url: '/v2/projects/big-meta',
+      method: 'post',
+    });
+
     const translations = translationsLoadable.data?._embedded?.keys?.[0];
 
     const linkToPlatform =
@@ -182,39 +190,58 @@ export const [DialogProvider, useDialogActions, useDialogContext] =
           }
         });
 
-        if (translations === undefined) {
-          await createKey.mutateAsync({
-            content: {
-              'application/json': {
-                name: props.keyName,
-                namespace: selectedNs || undefined,
-                translations: newTranslations,
-                screenshots: screenshots.map((sc) => ({
-                  uploadedImageId: sc.id,
-                  positions: sc.keyReferences?.map(mapPosition),
-                })),
-                tags,
+        const result = await (translations === undefined
+          ? createKey.mutateAsync({
+              content: {
+                'application/json': {
+                  name: props.keyName,
+                  namespace: selectedNs || undefined,
+                  translations: newTranslations,
+                  screenshots: screenshots.map((sc) => ({
+                    uploadedImageId: sc.id,
+                    positions: sc.keyReferences?.map(mapPosition),
+                  })),
+                  tags,
+                },
               },
-            },
-          });
-        } else {
-          await updateKey.mutateAsync({
+            })
+          : updateKey.mutateAsync({
+              content: {
+                'application/json': {
+                  name: props.keyName,
+                  namespace: selectedNs || undefined,
+                  translations: newTranslations,
+                  screenshotIdsToDelete: getRemovedScreenshots(),
+                  screenshotsToAdd: getJustUploadedScreenshots().map((sc) => ({
+                    uploadedImageId: sc.id,
+                    positions: sc.keyReferences?.map(mapPosition),
+                  })),
+                  tags,
+                },
+              },
+              path: { id: translations.keyId! },
+            }));
+
+        const version = result._internal?.version;
+
+        if (
+          version &&
+          (version === '??' ||
+            requirePlatformVersion(PLATFORM_SUPPORTING_BIG_META, version))
+        ) {
+          const surroundingKeys = props.uiProps.findPositions();
+          await updateMetadata.mutateAsync({
             content: {
               'application/json': {
-                name: props.keyName,
-                namespace: selectedNs || undefined,
-                translations: newTranslations,
-                screenshotIdsToDelete: getRemovedScreenshots(),
-                screenshotsToAdd: getJustUploadedScreenshots().map((sc) => ({
-                  uploadedImageId: sc.id,
-                  positions: sc.keyReferences?.map(mapPosition),
+                relatedKeysInOrder: surroundingKeys.map((val) => ({
+                  keyName: val.keyName,
+                  namespace: val.keyNamespace || undefined,
                 })),
-                tags,
               },
             },
-            path: { id: translations.keyId! },
           });
         }
+
         changeInTolgeeCache(
           props.keyName,
           selectedNs,
@@ -341,6 +368,7 @@ export const [DialogProvider, useDialogActions, useDialogContext] =
       scopesLoadable.error ||
       createKey.error ||
       updateKey.error ||
+      updateMetadata.error ||
       galleryError;
 
     const scopes = scopesLoadable.data?.scopes;