|
1 | | -import { Controller } from "@hotwired/stimulus" |
2 | | -import { get } from "@rails/request.js" |
3 | | -import Tags from "bootstrap5-tags" |
| 1 | +import { Controller } from "@hotwired/stimulus"; |
| 2 | +import { get } from "@rails/request.js"; |
| 3 | +import Tags from "bootstrap5-tags"; |
4 | 4 |
|
5 | 5 | export default class extends Controller { |
6 | | - static targets = ["language", "tagList"] |
| 6 | + static targets = ["tagList"]; |
7 | 7 |
|
8 | 8 | connect() { |
9 | | - this.initializeTags() |
10 | | - this.changeLanguage(); |
| 9 | + this.initializeTags(); |
11 | 10 | } |
12 | 11 |
|
13 | 12 | notify() { |
14 | | - this.dispatch("notify", { detail: { content: Array.from(this.tagListTarget.selectedOptions).map(option => option.value) } }) |
15 | | - } |
16 | | - |
17 | | - /** |
18 | | - * Handle language change event and update tags accordingly |
19 | | - * @param {Event} event - Change event |
20 | | - */ |
21 | | - async changeLanguage(_event) { |
22 | | - try { |
23 | | - const { resourceId, languageId } = this.getIds() |
24 | | - |
25 | | - const tags = await this.fetchTags(languageId) |
26 | | - const selectedTags = await this.fetchAssignedTags(languageId, resourceId) |
27 | | - |
28 | | - this.presentTags(tags, selectedTags) |
29 | | - } catch (error) { |
30 | | - console.error("Error changing language:", error) |
31 | | - } |
32 | | - } |
33 | | - |
34 | | - /** |
35 | | - * Extract resource and language IDs from the form |
36 | | - * @returns {Object} Object containing resourceId and languageId |
37 | | - */ |
38 | | - getIds() { |
39 | | - return { |
40 | | - resourceId: this.languageTarget.dataset.resourceId, |
41 | | - languageId: this.languageTarget.value |
42 | | - } |
43 | | - } |
44 | | - |
45 | | - /** |
46 | | - * Fetch available tags for a given language |
47 | | - * @param {string} languageId - ID of the selected language |
48 | | - * @returns {Object} Dictionary of tag names |
49 | | - */ |
50 | | - async fetchTags(languageId) { |
51 | | - try { |
52 | | - const response = await get(`/api/v1/tags?language_id=${languageId}`, { |
53 | | - responseKind: "json" |
54 | | - }) |
55 | | - |
56 | | - if (!response.ok) return [] |
57 | | - |
58 | | - const json = await response.json |
59 | | - return Object.fromEntries(json.map(({name}) => [name, name])) |
60 | | - } catch (error) { |
61 | | - console.error("Error fetching tags:", error) |
62 | | - return [] |
63 | | - } |
64 | | - } |
65 | | - |
66 | | - /** |
67 | | - * Fetch tags already assigned to the resource |
68 | | - * @param {string} languageId - ID of the selected language |
69 | | - * @param {string} resourceId - ID of the current resource |
70 | | - * @returns {string} Comma-separated list of tag names |
71 | | - */ |
72 | | - async fetchAssignedTags(languageId, resourceId) { |
73 | | - if (resourceId === undefined) return "" |
74 | | - |
75 | | - try { |
76 | | - const response = await get(`/topics/${resourceId}/tags?language_id=${languageId}`, { |
77 | | - responseKind: "json" |
78 | | - }) |
79 | | - |
80 | | - if (!response.ok) return "" |
81 | | - |
82 | | - const json = await response.json |
83 | | - return json.map(x => x.name).join() |
84 | | - } catch (error) { |
85 | | - console.error("Error fetching assigned tags:", error) |
86 | | - return "" |
87 | | - } |
88 | | - } |
89 | | - |
90 | | - /** |
91 | | - * Update the tags input with new tags and selections |
92 | | - * @param {Object} tags - Available tags |
93 | | - * @param {string} selectedTags - Previously selected tags |
94 | | - */ |
95 | | - presentTags(tags, selectedTags) { |
96 | | - this.initializeTags({ |
97 | | - items: tags, |
98 | | - selected: selectedTags |
99 | | - }, true) |
| 13 | + this.dispatch("notify", { |
| 14 | + detail: { |
| 15 | + content: Array.from(this.tagListTarget.selectedOptions).map( |
| 16 | + (option) => option.value |
| 17 | + ), |
| 18 | + }, |
| 19 | + }); |
100 | 20 | } |
101 | 21 |
|
102 | 22 | /** |
103 | 23 | * Initialize the tags input with given options |
104 | 24 | * @param {Object} options - Configuration options for bootstrap5-tags |
105 | 25 | */ |
106 | 26 | initializeTags(options = {}, reset = false) { |
107 | | - Tags.init(`select#${this.tagListTarget.id}`, options, reset) |
| 27 | + Tags.init(`select#${this.tagListTarget.id}`, options, reset); |
108 | 28 | } |
109 | 29 | } |
0 commit comments