Merge branch 'develop' into refactor/redefine-some-property-methods

argilla-io · Jun 28, 2024 · 2cd0e98 · 2cd0e98
2 parents d350cee + 60d9340
commit 2cd0e98
Show file tree

Hide file tree

Showing 37 changed files with 469 additions and 318 deletions.
diff --git a/.github/workflows/argilla-server.yml b/.github/workflows/argilla-server.yml
@@ -115,7 +115,7 @@ jobs:
     if: |
       github.ref == 'refs/heads/main'
       || github.ref == 'refs/heads/develop'
-      || contains(github.ref, "releases/")
+      || contains(github.ref, 'releases/')
       || github.event_name == 'workflow_dispatch'
       || github.event_name == 'pull_request'
     needs:

diff --git a/.github/workflows/argilla.docs.yml b/.github/workflows/argilla.docs.yml
@@ -9,10 +9,11 @@ on:
 
   push:
     tags:
-      - "v*"
+      - "v[2-9]+.[0-9]+.[0-9]+"
     branches:
       - "main"
       - "develop"
+      - "docs/**"
 
 defaults:
   run:
@@ -54,13 +55,50 @@ jobs:
         run: echo "${{ github.ref }}"
           echo "${{ github.head_ref }}"
 
-      - run: |
+      - name: Deploy Argilla docs (branch /main)
+        run: |
           pdm run mike deploy latest --push
           pdm run mike set-default --push latest
         if: github.ref == 'refs/heads/main'
 
-      - run: pdm run mike deploy dev --push
+      - name: Deploy Argilla docs (branch /develop)
+        run: pdm run mike deploy dev --push
         if: github.ref == 'refs/heads/develop'
 
-      - run: pdm run mike deploy ${{ github.ref_name }}
+      - name: Deploy Argilla docs (release $version)
+        run: |
+          version=$(echo $TAG_VERSION | awk -F \. {'print $1"."$2'})
+          echo "Deploying version ${version}"
+          pdm run mike deploy $version --push
+        if: startsWith(github.ref, 'refs/tags/')
+        env:
+          TAG_VERSION: ${{ github.ref_name }}
+
+      - name: Delete Argilla docs (versions 'docs_*')
+        id: delete_deployment
+        run: |
+          versions=$(pdm run mike list)
+          formatted_versions=$(echo "$versions" | tr ',' '\n' | tr -d '[]')
+          for version in $versions; do
+            if [[ $version == docs_* ]]; then
+              echo "Deleting version: $version"
+              pdm run mike delete "$version" --push
+            fi
+          done
         if: startsWith(github.ref, 'refs/tags/')
+
+      - name: Extract branch name
+        id: extract_branch_name
+        shell: bash
+        run: echo "branch_name=${GITHUB_HEAD_REF:-${GITHUB_REF#refs/heads/}}" | sed 's/\//_/g'  >> $GITHUB_OUTPUT
+
+      - name: Deploy Argilla docs (branch /docs/*)
+        run: pdm run mike deploy ${{ steps.extract_branch_name.outputs.branch_name }} --prop-set hidden=true --push
+        if: startsWith(github.ref, 'refs/heads/docs') || startsWith(github.head_ref, 'docs/')
+
+      - name: Add deployment message in PR
+        uses: mshick/add-pr-comment@v2
+        if: startsWith(github.ref, 'refs/heads/docs') || startsWith(github.head_ref, 'docs/')
+        with:
+          message: |
+            Docs for this PR have been deployed hidden from versioning: [https://argilla-io.github.io/argilla/${{ steps.extract_branch_name.outputs.branch_name }}](https://argilla-io.github.io/argilla/${{ steps.extract_branch_name.outputs.branch_name }})
diff --git a/argilla-frontend/components/base/base-collpasable-panel/BaseCollapsablePanel.vue b/argilla-frontend/components/base/base-collpasable-panel/BaseCollapsablePanel.vue
@@ -1,5 +1,11 @@
 <template>
-  <div class="panel" :class="isExpanded ? '--expanded' : '--collapsed'">
+  <div
+    class="panel"
+    :class="[
+      isExpanded ? '--expanded' : '--collapsed',
+      hideOnDesktop ? '--mobile' : undefined,
+    ]"
+  >
     <BaseButton class="panel__header" @click="toggleExpand(isExpanded)">
       <slot name="panelHeader" />
       <svgicon
@@ -25,6 +31,10 @@ export default {
       type: Boolean,
       default: false,
     },
+    hideOnDesktop: {
+      type: Boolean,
+      default: false,
+    },
   },
   methods: {
     toggleExpand(value) {
@@ -72,4 +82,10 @@ export default {
     @include font-size(13px);
   }
 }
+
+.--mobile {
+  @include media(">=desktop") {
+    display: none !important;
+  }
+}
 </style>
diff --git a/...omponents/features/annotation/container/fields/span-annotation/components/highlighting.ts b/...omponents/features/annotation/container/fields/span-annotation/components/highlighting.ts
@@ -315,9 +315,9 @@ export class Highlighting {
     }
 
     const entityCssKey = this.styles.entityCssKey;
-    CSS.highlights.entries().forEach(([key]) => {
+    for (const [key] of CSS.highlights.entries()) {
       if (key.startsWith(entityCssKey)) CSS.highlights.delete(key);
-    });
+    }
 
     for (const [entity, selections] of Object.entries(highlights)) {
       CSS.highlights.set(entity, new Highlight(...selections.flat()));

diff --git a/argilla-frontend/components/features/annotation/container/mode/BulkAnnotation.vue b/argilla-frontend/components/features/annotation/container/mode/BulkAnnotation.vue
@@ -164,8 +164,8 @@
         </HorizontalResizable>
       </template>
       <BaseCollapsablePanel
-        class="--mobile"
-        :is-expanded="expandedGuidelines"
+        hideOnDesktop
+        :isExpanded="expandedGuidelines"
         @toggle-expand="expandedGuidelines = !expandedGuidelines"
       >
         <template #panelHeader>
@@ -543,9 +543,4 @@ export default {
 [data-title] {
   @include tooltip-mini("right", 12px);
 }
-.--mobile {
-  @include media(">=desktop") {
-    display: none;
-  }
-}
 </style>
diff --git a/argilla-frontend/components/features/annotation/container/mode/FocusAnnotation.vue b/argilla-frontend/components/features/annotation/container/mode/FocusAnnotation.vue
@@ -84,8 +84,8 @@
       </HorizontalResizable>
     </template>
     <BaseCollapsablePanel
-      class="--mobile"
-      :is-expanded="expandedGuidelines"
+      hideOnDesktop
+      :isExpanded="expandedGuidelines"
       @toggle-expand="expandedGuidelines = !expandedGuidelines"
     >
       <template #panelHeader>
@@ -213,9 +213,4 @@ export default {
     display: none;
   }
 }
-.--mobile {
-  @include media(">=desktop") {
-    display: none;
-  }
-}
 </style>
diff --git a/argilla-frontend/components/features/datasets/datasets-empty/DatasetsEmpty.vue b/argilla-frontend/components/features/datasets/datasets-empty/DatasetsEmpty.vue
@@ -10,6 +10,8 @@
 </template>
 
 <script>
+import { useDatasetEmptyViewModel } from "./useDatasetEmptyViewModel";
+
 export default {
   data() {
     return {
@@ -20,20 +22,25 @@ export default {
   },
   async fetch() {
     const folderContent = require.context(
-      `../../../../../docs/_source/_common/snippets`,
+      `../../../../docs/snippets`,
       false,
       /.start_page.md/,
       "lazy"
     );
 
     const startPage = await folderContent("./start_page.md");
 
+    const content = await this.preFillData(startPage);
+
     this.content.tabs.push({
       id: "start-page",
       name: "Start page",
-      markdown: startPage.body,
+      markdown: content,
     });
   },
+  setup() {
+    return useDatasetEmptyViewModel();
+  },
 };
 </script>
 <style lang="scss" scoped>

diff --git a/argilla-frontend/components/features/datasets/datasets-empty/useDatasetEmptyViewModel.ts b/argilla-frontend/components/features/datasets/datasets-empty/useDatasetEmptyViewModel.ts
@@ -0,0 +1,85 @@
+import { useRunningEnvironment } from "~/v1/infrastructure/services/useRunningEnvironment";
+import { useUser } from "~/v1/infrastructure/services/useUser";
+
+const HF_PREFIX = "[hf_]";
+const LOCAL_PREFIX = "[local_]";
+const HF_OWNER = "[HF_OWNER]";
+const HF_SPACE_NAME = "[HF_SPACE_NAME]";
+const USER_API_KEY = "[USER_API_KEY]";
+const LOCAL_HOST = "[LOCAL_HOST]";
+
+export const useDatasetEmptyViewModel = () => {
+  const { isRunningOnHuggingFace, getHuggingFaceSpace } =
+    useRunningEnvironment();
+  const { getUser } = useUser();
+
+  const replaceLocalData = (rows) => {
+    const content = [];
+    const user = getUser();
+
+    for (const row of rows) {
+      if (row.includes(HF_PREFIX)) continue;
+
+      if (row.includes(LOCAL_PREFIX)) {
+        content.push(
+          row
+            .replace(LOCAL_PREFIX, "")
+            .replace(LOCAL_HOST, window.location.origin)
+        );
+        continue;
+      }
+
+      if (row.includes(USER_API_KEY)) {
+        content.push(row.replace(USER_API_KEY, user.apiKey));
+        continue;
+      }
+
+      content.push(row);
+    }
+
+    return Promise.resolve(content.join("\n"));
+  };
+
+  const replaceHFData = async (rows) => {
+    const user = getUser();
+    const hfEnvironment = await getHuggingFaceSpace();
+
+    const content = [];
+
+    for (const row of rows) {
+      if (row.includes(LOCAL_PREFIX)) continue;
+
+      if (row.includes(HF_PREFIX)) {
+        content.push(
+          row
+            .replace(HF_PREFIX, "")
+            .replace(HF_OWNER, hfEnvironment.user)
+            .replace(HF_SPACE_NAME, hfEnvironment.space)
+        );
+
+        continue;
+      }
+
+      if (row.includes(USER_API_KEY)) {
+        content.push(row.replace(USER_API_KEY, user.apiKey));
+        continue;
+      }
+
+      content.push(row);
+    }
+
+    return content.join("\n");
+  };
+
+  const preFillData = (startPage) => {
+    const rows = startPage.body.split("\n");
+
+    if (isRunningOnHuggingFace()) return replaceHFData(rows);
+
+    return replaceLocalData(rows);
+  };
+
+  return {
+    preFillData,
+  };
+};
diff --git a/argilla-frontend/components/features/global/AppHeader.vue b/argilla-frontend/components/features/global/AppHeader.vue
@@ -42,15 +42,6 @@ export default {
       type: Array,
     },
   },
-  computed: {
-    /**
-     * @deprecated Replace with useRole
-     */
-    isAdminOrOwnerRole() {
-      const role = this.$auth.user.role;
-      return role === "admin" || role === "owner";
-    },
-  },
   methods: {
     onBreadcrumbAction(action) {
       this.$emit("breadcrumb-action", action);

diff --git a/argilla-frontend/components/features/global/appHeader.vue b/argilla-frontend/components/features/global/appHeader.vue
@@ -42,15 +42,6 @@ export default {
       type: Array,
     },
   },
-  computed: {
-    /**
-     * @deprecated Replace with useRole
-     */
-    isAdminOrOwnerRole() {
-      const role = this.$auth.user.role;
-      return role === "admin" || role === "owner";
-    },
-  },
   methods: {
     onBreadcrumbAction(action) {
       this.$emit("breadcrumb-action", action);

diff --git a/argilla-frontend/components/features/global/user/UserAvatarTooltip.vue b/argilla-frontend/components/features/global/user/UserAvatarTooltip.vue
@@ -1,16 +1,16 @@
 <template>
   <div v-if="$auth.loggedIn" v-click-outside="close" class="user">
     <a class="user__button" @click.prevent="showSelector">
-      {{ firstChar(user.username) }}
+      {{ user.avatar }}
     </a>
     <div v-if="visibleSelector && user" class="user__content">
       <div class="head">
         <div class="left-head">
-          <span v-circle v-text="firstChar(user.username)" />
+          <span v-circle v-text="user.avatar" />
         </div>
         <div class="right-head">
           <div class="item">
-            <span v-text="user.username" />
+            <span v-text="user.userName" />
           </div>
           <div class="item" v-if="user.email">
             <span v-text="user.email" />
@@ -44,7 +44,7 @@
 import "assets/icons/external";
 import "assets/icons/log-out";
 
-import { useRoutes } from "~/v1/infrastructure/services/useRoutes";
+import { useAvatarTooltipViewModel } from "./userAvatarTooltipViewModel";
 
 export default {
   data: () => {
@@ -54,20 +54,11 @@ export default {
     };
   },
   computed: {
-    user() {
-      return this.$auth.user;
-    },
     currentYear() {
-      return this.currentDate.getFullYear();
-    },
-    currentDate() {
-      return new Date();
+      return new Date().getFullYear();
     },
   },
   methods: {
-    firstChar(name) {
-      return name.slice(0, 2);
-    },
     showSelector() {
       this.visibleSelector = !this.visibleSelector;
     },
@@ -81,7 +72,7 @@ export default {
     },
   },
   setup() {
-    return useRoutes();
+    return useAvatarTooltipViewModel();
   },
 };
 </script>

diff --git a/argilla-frontend/components/features/global/user/userAvatarTooltipViewModel.ts b/argilla-frontend/components/features/global/user/userAvatarTooltipViewModel.ts
@@ -0,0 +1,12 @@
+import { useRoutes } from "~/v1/infrastructure/services/useRoutes";
+import { useUser } from "~/v1/infrastructure/services/useUser";
+
+export const useAvatarTooltipViewModel = () => {
+  const { goToSignIn } = useRoutes();
+  const { user } = useUser();
+
+  return {
+    goToSignIn,
+    user,
+  };
+};