Merge branch 'develop' into feat/custom-field-support

.github/workflows/argilla-frontend.deploy-environment.yml

@@ -63,7 +63,7 @@ jobs:
             ADMIN_API_KEY=${{ steps.credentials.outputs.admin }}
             ANNOTATOR_PASSWORD=${{ steps.credentials.outputs.annotator }}
             ANNOTATOR_API_KEY=${{ steps.credentials.outputs.annotator }}
-            ARGILLA_ENABLE_TELEMETRY=0
+            HF_HUB_DISABLE_TELEMETRY=1
             API_BASE_URL=https://dev.argilla.io/
 
       - name: Post credentials in Slack

.github/workflows/argilla-frontend.yml

@@ -23,18 +23,24 @@ jobs:
       - name: Checkout Code 🛎
         uses: actions/checkout@v4
 
-      - name: Setup Node.js
+      - name: Setup Node.js ⚙️
         uses: actions/setup-node@v4
         with:
           node-version: 20
 
-      - name: Run tests
+      - name: Install dependencies 📦
         run: |
           npm install
+
+      - name: Run lint 🧹
+        run: |
           npm run lint
+
+      - name: Run tests 🧪
+        run: |
           npm run test
 
-      - name: Build package
+      - name: Build package 📦
         env:
           # BASE_URL is used in the server to support parameterizable base root path
           # See scripts/build_frontend.sh

.github/workflows/argilla-server.yml

@@ -51,8 +51,18 @@ jobs:
         ports:
           - 5432:5432
 
+      redis:
+        image: redis
+        options: >-
+          --health-cmd "redis-cli ping"
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
+        ports:
+          - 6379:6379
+
     env:
-      ARGILLA_ENABLE_TELEMETRY: 0
+      HF_HUB_DISABLE_TELEMETRY: 1
 
     steps:
       - name: Checkout Code 🛎

.github/workflows/argilla.yml

@@ -21,23 +21,15 @@ jobs:
   build:
     services:
       argilla-server:
-        image: argilladev/argilla-server:pr-5376
+        image: argilladev/argilla-hf-spaces:pr-5422
         ports:
           - 6900:6900
         env:
           ARGILLA_ENABLE_TELEMETRY: 0
-          ARGILLA_ELASTICSEARCH: http://elasticsearch:9200
           # Set credentials
           USERNAME: argilla
           PASSWORD: 12345678
           API_KEY: argilla.apikey
-      elasticsearch:
-        image: docker.elastic.co/elasticsearch/elasticsearch:8.8.2
-        ports:
-          - 9200:9200
-        env:
-          discovery.type: single-node
-          xpack.security.enabled: false
     runs-on: ubuntu-latest
     defaults:
       run:

argilla-frontend/CHANGELOG.md

@@ -0,0 +1,37 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+<!--
+These are the section headers that we use:
+* "Added" for new features.
+* "Changed" for changes in existing functionality.
+* "Deprecated" for soon-to-be removed features.
+* "Removed" for now removed features.
+* "Fixed" for any bug fixes.
+* "Security" in case of vulnerabilities.
+-->
+
+## [Unreleased]()
+
+## [2.2.0](https://github.com/argilla-io/argilla/compare/v2.1.0...v2.2.0)
+
+### Added
+
+- Added `Required/Optional` label on `Field dataset settings tab` and `Question dataset settings tab`. ([#5394](https://github.com/argilla-io/argilla/pull/5394))
+- Added new `ChatField`. ([#5376](https://github.com/argilla-io/argilla/pull/5376))
+
+## [2.1.0](https://github.com/argilla-io/argilla/compare/v2.0.1...v2.1.0)
+
+### Added
+
+- Added `DarkMode` ([#5412](https://github.com/argilla-io/argilla/pull/5412))
+- Added new `empty queue messages` ([#5403](https://github.com/argilla-io/argilla/pull/5403))
+- Added `HTML Sandbox` to support external and custom CSS and Javascript in fields ([#5353](https://github.com/argilla-io/argilla/pull/5353))
+- Added `Spanish` languages ([#5416](https://github.com/argilla-io/argilla/pull/5416))
+- Added new `ImageField` supporting URLs and Data URLs. ([#5279](https://github.com/argilla-io/argilla/pull/5279))
+
+> [!NOTE]
+> For older versions, please review the argilla/CHANGELOG.md and argilla-server/CHANGELOG.md files.

argilla-frontend/assets/icons/dark-theme.js

@@ -0,0 +1,27 @@
+/*
+ * coding=utf-8
+ * Copyright 2021-present, the Recognai S.L. team.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable */
+var icon = require('vue-svgicon')
+icon.register({
+  'dark-theme': {
+    width: 18,
+    height: 18,
+    viewBox: '0 0 18 18',
+    data: '<path pid="0" fill-rule="evenodd" clip-rule="evenodd" d="M9.203.002a9 9 0 108.49 6.664c-.509.488-1.036.919-1.568 1.292-1.217.854-2.46 1.407-3.588 1.657C10.822 9.996 9.644 9.644 9 9c-.644-.644-.996-1.822-.615-3.537.25-1.127.803-2.371 1.657-3.588.373-.532.804-1.059 1.292-1.569a9.032 9.032 0 00-2.13-.304zm4.888 14.09a7.169 7.169 0 002.025-3.995c-3.191 1.84-6.542 2.023-8.389.176-1.847-1.847-1.665-5.198.176-8.39a7.2 7.2 0 106.188 12.208z" _fill="#000"/>'
+  }
+})

argilla-frontend/assets/icons/index.js

@@ -13,6 +13,7 @@ require('./close')
 require('./code')
 require('./copy')
 require('./danger')
+require('./dark-theme')
 require('./discard')
 require('./draggable')
 require('./expand-arrows')
@@ -24,6 +25,7 @@ require('./focus-mode')
 require('./hand-labeling')
 require('./info')
 require('./kebab')
+require('./light-theme')
 require('./link')
 require('./log-out')
 require('./matching')
@@ -45,6 +47,7 @@ require('./sort')
 require('./stats')
 require('./suggestion')
 require('./support')
+require('./system-theme')
 require('./time')
 require('./trash-empty')
 require('./unavailable')

argilla-frontend/assets/icons/light-theme.js

@@ -0,0 +1,27 @@
+/*
+ * coding=utf-8
+ * Copyright 2021-present, the Recognai S.L. team.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable */
+var icon = require('vue-svgicon')
+icon.register({
+  'light-theme': {
+    width: 18,
+    height: 18,
+    viewBox: '0 0 18 18',
+    data: '<path pid="0" fill-rule="evenodd" clip-rule="evenodd" d="M9 12a3 3 0 100-6 3 3 0 000 6zm0 1.5a4.5 4.5 0 100-9 4.5 4.5 0 000 9zM8.25 0h1.5v3.046a6.059 6.059 0 00-1.5 0V0zM5.32 4.26L3.167 2.106l-1.06 1.06L4.26 5.321a6.035 6.035 0 011.06-1.06zM3.047 8.25H0v1.5h3.046a6.059 6.059 0 010-1.5zm1.214 4.43l-2.154 2.154 1.06 1.06 2.155-2.154a6.036 6.036 0 01-1.06-1.06zm3.99 2.274V18h1.5v-3.046a6.067 6.067 0 01-1.5 0zm4.43-1.214l2.154 2.154 1.06-1.06-2.154-2.155a6.036 6.036 0 01-1.06 1.06zm2.274-3.99H18v-1.5h-3.046a6.067 6.067 0 010 1.5zM13.74 5.32l2.154-2.154-1.06-1.06-2.155 2.154c.396.308.753.665 1.06 1.06z" _fill="#000"/>'
+  }
+})

argilla-frontend/assets/icons/system-theme.js

@@ -0,0 +1,27 @@
+/*
+ * coding=utf-8
+ * Copyright 2021-present, the Recognai S.L. team.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable */
+var icon = require('vue-svgicon')
+icon.register({
+  'system-theme': {
+    width: 18,
+    height: 18,
+    viewBox: '0 0 18 18',
+    data: '<path pid="0" d="M9 12.6a3.6 3.6 0 000-7.2v7.2z" _fill="#000"/><path pid="1" fill-rule="evenodd" clip-rule="evenodd" d="M9 0a9 9 0 100 18A9 9 0 009 0zm0 1.8v3.6a3.6 3.6 0 100 7.2v3.6A7.2 7.2 0 009 1.8z" _fill="#000"/>'
+  }
+})

argilla-frontend/assets/scss/abstract.scss

@@ -16,11 +16,12 @@
  */
 
 // abstract
-@import 'abstract/fonts/fonts';
-@import 'abstract/functions/functions';
-@import 'abstract/variables/variables';
-@import 'abstract/mixins/mixins';
-@import 'abstract/mixins/media-queries';
-@import 'abstract/mixins/grid-mixins';
-@import 'abstract/placeholders/placeholders';
-@import 'abstract/placeholders/tooltip';
+@import "abstract/fonts/fonts";
+@import "abstract/functions/functions";
+@import "abstract/variables/variables";
+@import "abstract/variables/themes";
+@import "abstract/mixins/mixins";
+@import "abstract/mixins/media-queries";
+@import "abstract/mixins/grid-mixins";
+@import "abstract/placeholders/placeholders";
+@import "abstract/placeholders/tooltip";

argilla-frontend/assets/scss/abstract/fonts/fonts.scss

@@ -1,8 +1,7 @@
 @font-face {
-    font-family: 'raptor_v2_premiumbold';
-    src: url('@/assets/fonts/raptorv2premium-bold-webfont.woff2') format('woff2'),
-         url('@/assets/fonts/raptorv2premium-bold-webfont.woff') format('woff');
-    font-weight: normal;
-    font-style: normal;
-
-}
+  font-family: "raptor_v2_premiumbold";
+  src: url("@/assets/fonts/raptorv2premium-bold-webfont.woff2") format("woff2"),
+    url("@/assets/fonts/raptorv2premium-bold-webfont.woff") format("woff");
+  font-weight: normal;
+  font-style: normal;
+}

argilla-frontend/assets/scss/abstract/functions/_functions.scss

@@ -29,18 +29,6 @@
 //  }
 
 @function calculateRem($size) {
-    $remSize: calc($size / 16px);
-    @return $remSize * 1rem;
-}
-
-// get KEY from MAP - COLOUR PALETTES
-// http://erskinedesign.com/blog/friendlier-colour-names-sass-maps/
-
-@function palette($palette, $tone: 'base') {
-    @if map-has-key($palettes, $palette) {
-      @return map-get(map-get($palettes, $palette), $tone);
-    }
-
-    @warn "Unknown `#{$palette}` in $palettes.";
-    @return null;
+  $remSize: calc($size / 16px);
+  @return $remSize * 1rem;
 }

argilla-frontend/assets/scss/abstract/placeholders/_placeholders.scss

@@ -27,49 +27,6 @@
   position: absolute;
 }
 
-// Linear gradient using $primary-color
-%primary-color-gradient {
-  background: $primary-color;
-  background: -moz-linear-gradient(
-    top,
-    $primary-color 0%,
-    $primary-lighten-color 100%
-  );
-  background: -webkit-linear-gradient(
-    top,
-    $primary-color 0%,
-    $primary-lighten-color 100%
-  );
-  background: linear-gradient(
-    to bottom,
-    $primary-color 0%,
-    $primary-lighten-color 100%
-  );
-}
-
-// Linear gradient using palette(blue, 300)
-%secondary-color-gradient {
-  background: palette(blue, 300);
-  background: -moz-linear-gradient(
-    top,
-    palette(blue, 300) 0%,
-    $secondary-darken-color 55%,
-    palette(blue, 300) 100%
-  );
-  background: -webkit-linear-gradient(
-    top,
-    palette(blue, 300) 0%,
-    $secondary-darken-color 55%,
-    palette(blue, 300) 100%
-  );
-  background: linear-gradient(
-    to bottom,
-    palette(blue, 300) 0%,
-    $secondary-darken-color 55%,
-    palette(blue, 300) 100%
-  );
-}
-
 // Align center block element
 %center {
   display: block;

argilla-frontend/assets/scss/abstract/placeholders/_tooltip.scss

@@ -1,7 +1,7 @@
 // tooltip
-$tooltip-bg: palette(grey, 100);
-$tooltip-mini-bg: palette(grey, 150);
-$tooltip-color: palette(white);
+$tooltip-bg: var(--bg-tooltip);
+$tooltip-mini-bg: var(--bg-tooltip);
+$tooltip-color: var(--color-white);
 $tooltip-title-font-size: 11px;
 $tooltip-font-size: 13px;
 $tooltip-triangle-size: 7px;