[WtC-M2] Create Vue 3 version of the custom LanguageSelector component
Closed, ResolvedPublic5 Estimated Story Points
Actions

Assigned To

Authored By

	• Sarai-WMDE
	Sep 8 2023, 1:16 PM

Project Tags

Referenced Files

None

Subscribers

Aklapper

ItamarWMDE

• Sarai-WMDE

Description

Problem

The LanguageSelector is not considered a core component by the Design Systems team at the moment, and it will not be included in the Codex library. It's still being decided where this reused component could live in the future.

This means that, most likely, WMDE won't have a standardized Vue 3 component to replace the custom LanguageSelector when conducting the migration of Mismatch Finder and Query Builder to Codex.

Solution

Make our custom LanguageSelector component compatible with Vue 3.

Considerations

In order to unblock WiKit's deprecation, we should replace the apparently only WiKit token used to currently style our custom language selector: $wikit-OptionsMenu-box-shadow;. It's fine if we use the discrete value: 0 2px 2px 0 rgba(0, 0, 0, 0.25).

Acceptance criteria

WMDE's custom LanguageSelector is updated to Vue 3 and can be used in the migrated version of Mismatch Finder
Any WiKit building blocks or styles are replaced

Related Objects
Search...

Status	Assigned	Task
Open	None	T327532 [EPIC] [WtC] Migrate WiKit-built products to Codex
Resolved	ItamarWMDE	T327683 [WtC] [EPIC] Migrate Mismatch Finder to Codex
Invalid	None	T347513 [SW] [WtC-M2] [EPIC] Migrate unavailable components to Vue 3
Resolved	karapayneWMDE	T346258 [SW] [WtC-M2] [EPIC] Gradually update relevant Mismatch Finder code to Vue 3
Resolved	HasanAkgun_WMDE	T345915 [WtC-M2] Create Vue 3 version of the custom LanguageSelector component

Event Timeline

• Sarai-WMDE created this task.Sep 8 2023, 1:16 PM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptSep 8 2023, 1:16 PM

• Sarai-WMDE renamed this task from [WtC] Create Vue 3 version of LanguageSelector component to [WtC] Create Vue 3 version of custom LanguageSelector component.Sep 8 2023, 1:16 PM

• Sarai-WMDE updated the task description. (Show Details)

Maintenance_bot added a project: Wikidata.Sep 8 2023, 1:30 PM

• Sarai-WMDE added a parent task: T327532: [EPIC] [WtC] Migrate WiKit-built products to Codex.Sep 8 2023, 4:39 PM

• Sarai-WMDE renamed this task from [WtC] Create Vue 3 version of custom LanguageSelector component to [WtC-M2] Create Vue 3 version of custom LanguageSelector component.Sep 12 2023, 8:46 AM

• Sarai-WMDE updated the task description. (Show Details)

• Sarai-WMDE added a parent task: T327683: [WtC] [EPIC] Migrate Mismatch Finder to Codex.Sep 12 2023, 9:13 AM

• Sarai-WMDE added a subtask: T345905: [WtC-M3] [Blocked] LanguageSelector: Adjust styling to meet new Codex design guidelines.Sep 12 2023, 12:09 PM

• Sarai-WMDE mentioned this in T346171: [WtC-M2] [EPIC] Replace WiKit components by available Codex components.Sep 12 2023, 4:51 PM

• Sarai-WMDE updated the task description. (Show Details)Sep 22 2023, 4:07 PM

• Sarai-WMDE added a parent task: T347513: [SW] [WtC-M2] [EPIC] Migrate unavailable components to Vue 3.Sep 27 2023, 5:01 PM

• Sarai-WMDE renamed this task from [WtC-M2] Create Vue 3 version of custom LanguageSelector component to [WtC-M2] Create Vue 3 version of the custom LanguageSelector component.Oct 5 2023, 5:01 PM

• Sarai-WMDE added a parent task: T346258: [SW] [WtC-M2] [EPIC] Gradually update relevant Mismatch Finder code to Vue 3.Oct 11 2023, 12:20 PM

• Sarai-WMDE renamed this task from [WtC-M2] Create Vue 3 version of the custom LanguageSelector component to [SW] [WtC-M2] Create Vue 3 version of the custom LanguageSelector component.Oct 23 2023, 4:04 PM

• Sarai-WMDE mentioned this in T346258: [SW] [WtC-M2] [EPIC] Gradually update relevant Mismatch Finder code to Vue 3.Oct 25 2023, 8:44 AM

Arian_Bozorg moved this task from UX Backlog to Unified QT Backlog on the [Archived]Wikidata Dev Team board.Oct 25 2023, 1:40 PM

• Sarai-WMDE renamed this task from [SW] [WtC-M2] Create Vue 3 version of the custom LanguageSelector component to [WtC-M2] Create Vue 3 version of the custom LanguageSelector component.Oct 25 2023, 1:41 PM

Arian_Bozorg set the point value for this task to 5.Nov 15 2023, 9:55 AM

Arian_Bozorg moved this task from Unified QT Backlog to Quality Tools "Sprint" on the [Archived]Wikidata Dev Team board.

Arian_Bozorg edited projects, added: [Archived]Wikidata Dev Team (Quality Tools "Sprint"); removed: [Archived]Wikidata Dev Team.

ItamarWMDE updated the task description. (Show Details)Nov 15 2023, 10:43 AM

ItamarWMDE removed a project: Wikidata Query Builder.

Task Breakdown Notes:

We decided to update our application's syntax to composition API, and this component can be a good testing ground for this.
We should make sure not to use any Wikit Components or Tokens for the LanguageSelector.
Since the plan of action can be parallelized, if you want to pick up a task just create it ad hoc before you start

Potential Plan of Action:

Migrate the Input to composition API
Migrate the OptionsMenu...
Migrate the Parent component (LanguageSelector.vue) to composition

HasanAkgun_WMDE claimed this task.Nov 20 2023, 10:58 AM

HasanAkgun_WMDE moved this task from Backlog to Doing on the [Archived]Wikidata Dev Team (Quality Tools "Sprint") board.

PR: https://github.com/wmde/wikidata-mismatch-finder/pull/773

HasanAkgun_WMDE moved this task from Doing to Peer Review on the [Archived]Wikidata Dev Team (Quality Tools "Sprint") board.Nov 22 2023, 11:49 AM

HasanAkgun_WMDE moved this task from Peer Review to Product Verification on the [Archived]Wikidata Dev Team (Quality Tools "Sprint") board.Nov 28 2023, 4:57 PM

No (new) visual or interactive issues were detected as a result of the LanguageSelector's adaptation to Vue 3. The changes were reviewed in Chrome 119, Safari 17 and Firefox 119 on MacOS Sonoma. Replacement done 🎉

• Sarai-WMDE reopened this task as Open.Nov 30 2023, 12:55 PM

• Sarai-WMDE closed this task as Resolved.

• Sarai-WMDE updated the task description. (Show Details)

Arian_Bozorg moved this task from Product Verification to Done on the [Archived]Wikidata Dev Team (Quality Tools "Sprint") board.May 16 2024, 8:06 AM

• Sarai-WMDE mentioned this in T367909: [WtC-M3] [QB] Port LanguageSelector to Query Builder.Jul 30 2024, 3:23 PM

karapayneWMDE mentioned this in T345905: [WtC-M3] [Blocked] LanguageSelector: Adjust styling to meet new Codex design guidelines.May 8 2026, 12:56 PM

karapayneWMDE removed a subtask: T345905: [WtC-M3] [Blocked] LanguageSelector: Adjust styling to meet new Codex design guidelines.