diff --git a/argilla-frontend/CHANGELOG.md b/argilla-frontend/CHANGELOG.md index c0da610be7..2e6e157574 100644 --- a/argilla-frontend/CHANGELOG.md +++ b/argilla-frontend/CHANGELOG.md @@ -19,10 +19,14 @@ These are the section headers that we use: ### Added - Add a high-contrast theme & improvements for the forced-colors mode. ([#5661](https://github.com/argilla-io/argilla/pull/5661)) +- Added redirect to error page when repoId is invalid ([#5670](https://github.com/argilla-io/argilla/pull/5670)) ### Fixed - Fixed redirection problems after users sign-in using HF OAuth. ([#5635](https://github.com/argilla-io/argilla/pull/5635)) +- Fixed highlighting of the searched text in text and chat fields ([#5678](https://github.com/argilla-io/argilla/pull/5678)) +- Fixed validation for rating question when creating a dataset ([#5670](https://github.com/argilla-io/argilla/pull/5670)) +- Fixed question name based on question type when creating a dataset ([#5670](https://github.com/argilla-io/argilla/pull/5670)) ## [2.4.0](https://github.com/argilla-io/argilla/compare/v2.3.0...v2.4.0) diff --git a/argilla-frontend/components/features/annotation/container/fields/chat-field/ChatField.vue b/argilla-frontend/components/features/annotation/container/fields/chat-field/ChatField.vue index 971ede238a..1389c8f155 100644 --- a/argilla-frontend/components/features/annotation/container/fields/chat-field/ChatField.vue +++ b/argilla-frontend/components/features/annotation/container/fields/chat-field/ChatField.vue @@ -2,6 +2,7 @@
diff --git a/argilla-frontend/components/features/annotation/container/fields/text-field/TextField.vue b/argilla-frontend/components/features/annotation/container/fields/text-field/TextField.vue index 3fe4a7ced1..81437082bd 100644 --- a/argilla-frontend/components/features/annotation/container/fields/text-field/TextField.vue +++ b/argilla-frontend/components/features/annotation/container/fields/text-field/TextField.vue @@ -16,7 +16,7 @@
-
+
diff --git a/argilla-frontend/components/features/annotation/container/fields/useSearchTextHighlight.ts b/argilla-frontend/components/features/annotation/container/fields/useSearchTextHighlight.ts index 06ecce8dcb..2b23ab4d57 100644 --- a/argilla-frontend/components/features/annotation/container/fields/useSearchTextHighlight.ts +++ b/argilla-frontend/components/features/annotation/container/fields/useSearchTextHighlight.ts @@ -121,8 +121,10 @@ export const useSearchTextHighlight = (fieldId: string) => { const highlightText = (searchText: string) => { const fieldComponent = document.getElementById(FIELD_ID_TO_HIGHLIGHT); - if (!searchText || !fieldComponent) return; - + if (!searchText || !fieldComponent) { + CSS.highlights.delete(HIGHLIGHT_CLASS); + return; + } const ranges = createRangesToHighlight(fieldComponent, searchText); CSS.highlights.set(HIGHLIGHT_CLASS, new Highlight(...ranges)); diff --git a/argilla-frontend/components/features/dataset-creation/configuration/DatasetConfigurationForm.vue b/argilla-frontend/components/features/dataset-creation/configuration/DatasetConfigurationForm.vue index 7727897f6c..82d857a91b 100644 --- a/argilla-frontend/components/features/dataset-creation/configuration/DatasetConfigurationForm.vue +++ b/argilla-frontend/components/features/dataset-creation/configuration/DatasetConfigurationForm.vue @@ -31,13 +31,11 @@ :group="{ name: 'fields' }" ghost-class="config-form__ghost" :disabled="isFocused" - @start="drag = true" - @end="drag = false" > { + const numberInName = question.name.split("_").pop(); + return parseInt(numberInName) || 0; + }) + ); + }, + }, methods: { createDataset() { this.create(this.dataset); }, - addQuestion(type) { - const questionName = `${type} ${this.dataset.selectedSubset.questions.length}`; - this.dataset.selectedSubset.addQuestion(questionName, { type }); + generateName(type, number) { + const typeName = this.$t(`config.questionId.${type}`); + return `${typeName}_${parseInt(number) || 0}`; }, - onTypeIsChanged(name, type) { - this.dataset.selectedSubset.addQuestion(name, { - type: type.value, + addQuestion(type) { + const questionName = this.generateName( + type, + this.getMaxNumberInNames + 1 + ); + this.dataset.selectedSubset.addQuestion(questionName, { + type, }); }, + onTypeIsChanged(oldName, type) { + const numberInName = oldName.split("_").pop(); + const index = this.dataset.selectedSubset.questions.findIndex( + (q) => q.name === oldName + ); + this.dataset.selectedSubset.removeQuestion(oldName); + const newQuestionName = this.generateName(type.value, numberInName); + this.dataset.selectedSubset.addQuestion( + newQuestionName, + { + type: type.value, + }, + index !== -1 ? index : undefined + ); + }, }, setup() { return useDatasetConfigurationForm(); @@ -223,7 +249,6 @@ export default { } &__ghost { opacity: 0.5; - background: lime; } &__selector { &__intro { @@ -247,8 +272,5 @@ export default { justify-content: center; } } - .flip-list-move { - transition: transform 0.3s; - } } diff --git a/argilla-frontend/components/features/dataset-creation/configuration/questions/DatasetConfigurationQuestion.vue b/argilla-frontend/components/features/dataset-creation/configuration/questions/DatasetConfigurationQuestion.vue index 387f1be38a..6dcfd4dd20 100644 --- a/argilla-frontend/components/features/dataset-creation/configuration/questions/DatasetConfigurationQuestion.vue +++ b/argilla-frontend/components/features/dataset-creation/configuration/questions/DatasetConfigurationQuestion.vue @@ -29,7 +29,7 @@ /> -
- +
+
+ +
+
diff --git a/argilla-frontend/pages/useNewDatasetViewModel.ts b/argilla-frontend/pages/useNewDatasetViewModel.ts index a66fb469f3..8cce1d4f3a 100644 --- a/argilla-frontend/pages/useNewDatasetViewModel.ts +++ b/argilla-frontend/pages/useNewDatasetViewModel.ts @@ -1,15 +1,20 @@ import { useResolve } from "ts-injecty"; -import { ref, useRoute } from "@nuxtjs/composition-api"; +import { ref, useRoute, useContext } from "@nuxtjs/composition-api"; import { GetDatasetCreationUseCase } from "~/v1/domain/usecases/get-dataset-creation-use-case"; export const useNewDatasetViewModel = () => { + const { error } = useContext(); const datasetConfig = ref(); const getDatasetCreationUseCase = useResolve(GetDatasetCreationUseCase); const getNewDatasetByRepoId = async (repositoryId: string) => { - datasetConfig.value = await getDatasetCreationUseCase.execute( - decodeURI(repositoryId) - ); + try { + datasetConfig.value = await getDatasetCreationUseCase.execute( + repositoryId + ); + } catch (e) { + error({ statusCode: 404, message: "Cannot fetch the dataset" }); + } }; const getNewDatasetByRepoIdFromUrl = async () => { diff --git a/argilla-frontend/plugins/directives/required-field.directive.js b/argilla-frontend/plugins/directives/required-field.directive.js index 163fff4c04..c478d96c18 100644 --- a/argilla-frontend/plugins/directives/required-field.directive.js +++ b/argilla-frontend/plugins/directives/required-field.directive.js @@ -5,22 +5,19 @@ import Vue from "vue"; // => color (String) the color of the asterisk : black by default Vue.directive("required-field", { - bind: (element, binding, node) => { - if (binding?.value) { - const { color, show } = binding?.value ?? { show: true, color: "black" }; - - if (!show) return; - - const text = document.createTextNode(" *"); - const textWrapper = document.createElement("span"); - textWrapper.setAttribute("title", "Required response"); - textWrapper.setAttribute("role", "mark"); - textWrapper.style.color = color; - textWrapper.appendChild(text); - - node.context.$nextTick(() => { - element.insertAdjacentElement("afterEnd", textWrapper); - }); + bind(element, binding) { + const span = document.createElement("span"); + span.textContent = " *"; + span.style.color = binding.value.color; + span.setAttribute("title", "Required response"); + span.setAttribute("role", "mark"); + element.appendChild(span); + span.style.display = binding.value.show ? "inline" : "none"; + }, + update(element, binding) { + const span = element.querySelector("span"); + if (span) { + span.style.display = binding.value.show ? "inline" : "none"; } }, }); diff --git a/argilla-frontend/translation/en.js b/argilla-frontend/translation/en.js index caf52c564a..009525c13c 100644 --- a/argilla-frontend/translation/en.js +++ b/argilla-frontend/translation/en.js @@ -282,6 +282,9 @@ export default { atLeastTwoOptions: "At least two options are required", optionsWithoutLabel: "Empty options are not allowed", }, + rating: { + atLeastTwoOptions: "At least two options are required", + }, }, atLeastOneQuestion: "At least one question is required.", atLeastOneRequired: "At least one required question is needed.", @@ -327,6 +330,14 @@ export default { span: "Span", "no mapping": "No mapping", }, + questionId: { + text: "text", + rating: "rating", + label_selection: "label", + ranking: "ranking", + multi_label_selection: "multi-label", + span: "span", + }, }, persistentStorage: { adminOrOwner: diff --git a/argilla-frontend/translation/es.js b/argilla-frontend/translation/es.js index fc00604f26..ed40c9396e 100644 --- a/argilla-frontend/translation/es.js +++ b/argilla-frontend/translation/es.js @@ -280,6 +280,9 @@ export default { atLeastTwoOptions: "Se requieren al menos dos opciones", optionsWithoutLabel: "No se permiten opciones vacías", }, + rating: { + atLeastTwoOptions: "Se requieren al menos dos opciones", + }, }, atLeastOneQuestion: "Se requiere al menos una pregunta.", atLeastOneRequired: "Se requiere al menos una pregunta obligatoria.", diff --git a/argilla-frontend/v1/domain/entities/hub/QuestionCreation.ts b/argilla-frontend/v1/domain/entities/hub/QuestionCreation.ts index 2d23e49ed4..c8ff905aa0 100644 --- a/argilla-frontend/v1/domain/entities/hub/QuestionCreation.ts +++ b/argilla-frontend/v1/domain/entities/hub/QuestionCreation.ts @@ -64,6 +64,10 @@ export class QuestionCreation { this.required = true; } + get isRequired(): boolean { + return this.required; + } + get isTextType(): boolean { return this.type.isTextType; } @@ -111,6 +115,11 @@ export class QuestionCreation { ); } } + if (this.isRatingType) { + if (this.options.length < 2) { + errors.push("datasetCreation.questions.rating.atLeastTwoOptions"); + } + } return errors; } diff --git a/argilla-frontend/v1/domain/entities/hub/Subset.ts b/argilla-frontend/v1/domain/entities/hub/Subset.ts index de02ff89b5..ba72804400 100644 --- a/argilla-frontend/v1/domain/entities/hub/Subset.ts +++ b/argilla-frontend/v1/domain/entities/hub/Subset.ts @@ -202,7 +202,11 @@ export class Subset { } } - public addQuestion(name: string, settings: QuestionPrototype) { + public addQuestion( + name: string, + settings: QuestionPrototype, + position?: number + ) { const { type } = settings; if (type === "label_selection") { settings.options = [ @@ -266,6 +270,10 @@ export class Subset { return; } - this.questions.push(new QuestionCreation(name, settings)); + this.questions.splice( + position ?? this.questions.length, + 0, + new QuestionCreation(name, settings) + ); } } diff --git a/argilla-frontend/v1/infrastructure/repositories/HubRepository.ts b/argilla-frontend/v1/infrastructure/repositories/HubRepository.ts index 82ef090e67..7ca3528929 100644 --- a/argilla-frontend/v1/infrastructure/repositories/HubRepository.ts +++ b/argilla-frontend/v1/infrastructure/repositories/HubRepository.ts @@ -2,6 +2,10 @@ import { type NuxtAxiosInstance } from "@nuxtjs/axios"; import { PublicNuxtAxiosInstance } from "../services"; import { DatasetCreation } from "~/v1/domain/entities/hub/DatasetCreation"; +export const enum HUB_REPOSITORY_ERRORS { + NOT_EXIST = "ERROR_FETCHING_DATASET", +} + export class HubRepository { private axios: NuxtAxiosInstance; constructor(axios: PublicNuxtAxiosInstance) { @@ -19,8 +23,10 @@ export class HubRepository { ); return data.dataset_info; - } catch { - return {}; + } catch (e) { + throw { + response: HUB_REPOSITORY_ERRORS.NOT_EXIST, + }; } } diff --git a/argilla-server/pyproject.toml b/argilla-server/pyproject.toml index 8cf99d9026..4a43fdc0c6 100644 --- a/argilla-server/pyproject.toml +++ b/argilla-server/pyproject.toml @@ -1,4 +1,5 @@ [project] +# Remove me name = "argilla-server" dynamic = ["version"] description = "Open-source tool for exploring, labeling, and monitoring data for NLP projects."