[FEATURE-BRANCH] Argilla direct import from Hub

.github/workflows/argilla.yml

@@ -21,7 +21,7 @@ jobs:
   build:
     services:
       argilla-server:
-        image: argilladev/argilla-hf-spaces:develop
+        image: argilladev/argilla-hf-spaces:pr-5572
         ports:
           - 6900:6900
         env:

argilla-frontend/assets/icons/assign.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({
+  'assign': {
+    width: 10,
+    height: 10,
+    viewBox: '0 0 10 10',
+    data: '<path pid="0" d="M1.625 2.75c.416 0 .78-.226.974-.563h3.526a1.125 1.125 0 010 2.25h-2.25a2.25 2.25 0 000 4.5h3.526a1.125 1.125 0 100-1.124H3.875a1.125 1.125 0 010-2.25h2.25a2.25 2.25 0 000-4.5H2.599a1.125 1.125 0 10-.974 1.687z"/>'
+  }
+})

argilla-frontend/assets/icons/import.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({
+  'import': {
+    width: 29,
+    height: 31,
+    viewBox: '0 0 29 31',
+    data: '<path pid="0" d="M3.446 12.957v15.014h22.216V12.957h-6.348V9.955h9.521v21.019H.272V9.954h9.521v3.003H3.446z" _fill="#000" fill-opacity=".87"/><path pid="1" d="M16.14.974h-3.173V19.07l-4.024-3.807L6.7 17.386l7.855 7.431 7.854-7.431-2.244-2.123-4.023 3.807V.974z" _fill="#000" fill-opacity=".87"/>'
+  }
+})

argilla-frontend/assets/icons/index.js

@@ -1,6 +1,7 @@
 /* eslint-disable */
 require('./arrow-down')
 require('./arrow-up')
+require('./assign')
 require('./bulk-mode')
 require('./change-height')
 require('./check')
@@ -23,6 +24,7 @@ require('./external')
 require('./filter')
 require('./focus-mode')
 require('./hand-labeling')
+require('./import')
 require('./info')
 require('./kebab')
 require('./light-theme')
@@ -34,10 +36,13 @@ require('./meatballs')
 require('./minimize-arrows')
 require('./no-matching')
 require('./pen')
+require('./plus')
 require('./progress')
+require('./question-answering')
 require('./refresh')
 require('./reset')
 require('./row-last')
+require('./rows')
 require('./search')
 require('./settings')
 require('./shortcuts')
@@ -48,6 +53,8 @@ require('./stats')
 require('./suggestion')
 require('./support')
 require('./system-theme')
+require('./text-classification')
+require('./text-to-image')
 require('./time')
 require('./trash-empty')
 require('./unavailable')

argilla-frontend/assets/icons/plus.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({
+  'plus': {
+    width: 16,
+    height: 16,
+    viewBox: '0 0 16 16',
+    data: '<path pid="0" d="M8 2a.75.75 0 00-.75.75v4.5h-4.5a.75.75 0 000 1.5h4.5v4.5a.75.75 0 001.5 0v-4.5h4.5a.75.75 0 000-1.5h-4.5v-4.5A.75.75 0 008 2z" _fill="#000" fill-opacity=".87"/>'
+  }
+})

argilla-frontend/assets/icons/question-answering.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({
+  'question-answering': {
+    width: 15,
+    height: 15,
+    viewBox: '0 0 15 15',
+    data: '<path pid="0" d="M1.299 4.628h3.937V1.565H1.3v3.063zm.875-2.188H4.36v1.313H2.174V2.44zM1.299 9.003h3.937V5.94H1.3v3.063zm.875-2.188H4.36v1.313H2.174V6.815zM1.299 13.378h3.937v-3.063H1.3v3.063zm.875-2.188H4.36v1.313H2.174V11.19zM12.236 4.628H8.3l1.492-1.57-.617-.618-2.625 2.625L9.174 7.69l.617-.616-1.492-1.571h3.937a.438.438 0 01.438.437v5.25a.438.438 0 01-.438.438h-5.25v.875h5.25a1.313 1.313 0 001.313-1.313V5.94a1.313 1.313 0 00-1.313-1.312z" _fill="#3B82F6"/>'
+  }
+})

argilla-frontend/assets/icons/rows.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({
+  'rows': {
+    width: 10,
+    height: 8,
+    viewBox: '0 0 10 8',
+    data: '<path pid="0" fill-rule="evenodd" clip-rule="evenodd" d="M8.68.7H1a.3.3 0 00-.3.3v1.421h8.28V1a.3.3 0 00-.3-.3zM.7 4.879V3.12h8.28v1.76L.7 4.879zm0 .7V7a.3.3 0 00.3.3h7.68a.3.3 0 00.3-.3V5.579H.7zM1 0a1 1 0 00-1 1v6a1 1 0 001 1h7.68a1 1 0 001-1V1a1 1 0 00-1-1H1z" _fill="#000" fill-opacity=".54"/>'
+  }
+})

argilla-frontend/assets/icons/text-classification.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({
+  'text-classification': {
+    width: 15,
+    height: 15,
+    viewBox: '0 0 15 15',
+    data: '<path pid="0" d="M4.439 10.315a.875.875 0 100-1.75.875.875 0 000 1.75zM4.439 13.815a.875.875 0 100-1.75.875.875 0 000 1.75zM4.439 7.69a.875.875 0 100-1.75.875.875 0 000 1.75zM12.314 3.315a.875.875 0 100-1.75.875.875 0 000 1.75zM9.689 4.19a.875.875 0 100-1.75.875.875 0 000 1.75zM12.314 5.94a.875.875 0 100-1.75.875.875 0 000 1.75zM8.814 6.815a.875.875 0 100-1.75.875.875 0 000 1.75zM12.314 11.19a.875.875 0 100-1.75.875.875 0 000 1.75zM11.439 13.815a.875.875 0 100-1.75.875.875 0 000 1.75zM8.814 12.94a.875.875 0 100-1.75.875.875 0 000 1.75zM9.689 10.315a.875.875 0 100-1.75.875.875 0 000 1.75zM7.064 3.315a.875.875 0 100-1.75.875.875 0 000 1.75zM1.814 12.065a.875.875 0 100-1.75.875.875 0 000 1.75zM1.814 8.565a.875.875 0 100-1.75.875.875 0 000 1.75z" _fill="#F97316"/>'
+  }
+})

argilla-frontend/assets/icons/text-to-image.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({
+  'text-to-image': {
+    width: 15,
+    height: 15,
+    viewBox: '0 0 15 15',
+    data: '<path pid="0" d="M12.986 6.71l-1.442-1.442a.694.694 0 00-.98 0l-6.125 6.127v2.42h2.42l6.127-6.125a.694.694 0 000-.98zm-6.489 6.23H5.314v-1.182l4.13-4.131 1.183 1.183-4.13 4.13zm4.75-4.749l-1.184-1.183.992-.991L12.238 7.2l-.992.991zM4.876 8.128h.875V5.065h1.313V4.19h-3.5v.875h1.312v3.063z" _fill="#F59E0B"/><path pid="1" d="M3.564 9.44h-1.75v-7h7v1.75h.875V2.44a.875.875 0 00-.875-.875h-7a.875.875 0 00-.875.875v7a.875.875 0 00.875.875h1.75V9.44z" _fill="#F59E0B"/>'
+  }
+})

argilla-frontend/assets/scss/abstract/variables/_themes.scss

@@ -18,6 +18,7 @@
   --bg-accent-grey-2: hsl(0, 0%, 100%);
   --bg-accent-grey-3: hsl(0, 0%, 98%);
   --bg-accent-grey-4: hsl(0, 0%, 98%);
+  --bg-accent-grey-5: hsl(0, 0%, 100%);
   --bg-opacity-1: hsla(0, 0%, 0%, 0.01);
   --bg-opacity-2: hsla(0, 0%, 0%, 0.02);
   --bg-opacity-3: hsla(0, 0%, 0%, 0.03);
@@ -76,6 +77,8 @@
   --bg-banner-warning: hsl(47, 83%, 91%);
   --bg-banner-error: hsl(3, 100%, 92%);
   --bg-tooltip: var(--color-dark-grey);
+  --bg-config-card: hsl(227, 100%, 90%);
+  --bg-congig-alert: hsl(41, 100%, 82%, 0.8);
   --fg-chat-1: #488d81;
   --fg-chat-2: #e07be0;
   --fg-chat-3: #fd926a;
@@ -94,6 +97,7 @@
   --bg-accent-grey-2: hsl(214, 12%, 16%);
   --bg-accent-grey-3: hsl(214, 12%, 14%);
   --bg-accent-grey-4: hsl(214, 12%, 16%);
+  --bg-accent-grey-5: hsl(214, 12%, 20%);
   --bg-opacity-1: hsla(0, 0%, 100%, 0.01);
   --bg-opacity-2: hsla(0, 0%, 100%, 0.02);
   --bg-opacity-3: hsla(0, 0%, 100%, 0.03);
@@ -146,6 +150,8 @@
   --bg-banner-warning: hsl(47, 83%, 16%);
   --bg-banner-error: hsl(3, 100%, 20%);
   --bg-tooltip: hsl(207, 9%, 32%);
+  --bg-config-card: hsla(227, 100%, 66%, 20%);
+  --bg-congig-alert: hsl(41, 100%, 82%, 0.4);
   --fg-chat-1: #628e87;
   --fg-chat-2: #af6daf;
   --fg-chat-3: #cd8065;

argilla-frontend/assets/scss/base/base.scss

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap");
 html {
   box-sizing: border-box;
   -webkit-text-size-adjust: 100%;

argilla-frontend/components/base/base-card/BaseCard.vue

@@ -61,7 +61,7 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .card {
   display: flex;
   align-items: flex-end;

argilla-frontend/components/base/base-code/BaseCode.vue

@@ -9,7 +9,6 @@
 <script>
 import { useTranslate } from "~/v1/infrastructure/services";
 import "assets/icons/copy";
-
 export default {
   props: {
     code: {

argilla-frontend/components/base/base-input/BaseInput.vue

@@ -17,6 +17,7 @@
 
 <template>
   <input
+    ref="input"
     class="input"
     :type="type"
     :name="name"
@@ -65,6 +66,7 @@ export default {
       this.setParentPlaceholder();
       this.handleMaxLength();
       this.updateValues();
+      this.$refs.input.focus();
     });
   },
 };