Skip to content

Commit 79279ca

Browse files
guerganaguergana
authored
Replace wikit Message by Codex Message component (#769)
Bug: T347183
1 parent dcdcb6d commit 79279ca

File tree

7 files changed

+29
-37
lines changed

7 files changed

+29
-37
lines changed

‎resources/js/Pages/Home.vue‎

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -59,9 +59,9 @@
5959
</section>
6060

6161
<section id="message-section">
62-
<Message v-if="unexpectedError || serversideValidationError" type="error">
62+
<cdx-message v-if="unexpectedError || serversideValidationError" type="error">
6363
<span>{{ $i18n('server-error') }}</span>
64-
</Message>
64+
</cdx-message>
6565
</section>
6666

6767
<section id="querying-section">
@@ -106,11 +106,8 @@
106106
import { Head as InertiaHead } from '@inertiajs/inertia-vue3';
107107
import { mapState } from 'pinia';
108108
import { useStore } from '../store';
109-
import {
110-
Message,
111-
TextArea
112-
} from '@wmde/wikit-vue-components';
113-
import { CdxDialog, CdxButton, CdxIcon } from "@wikimedia/codex";
109+
import { TextArea } from '@wmde/wikit-vue-components';
110+
import { CdxDialog, CdxButton, CdxIcon, CdxMessage } from "@wikimedia/codex";
114111
import { cdxIconDie, cdxIconInfo } from '@wikimedia/codex-icons';
115112
import { defineComponent } from 'vue';
116113
@@ -140,8 +137,8 @@
140137
CdxDialog,
141138
CdxButton,
142139
CdxIcon,
140+
CdxMessage,
143141
InertiaHead,
144-
Message,
145142
TextArea,
146143
},
147144
setup() {

‎resources/js/Pages/Results.vue‎

Lines changed: 13 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -47,25 +47,25 @@
4747
</p>
4848
</section>
4949
<section id="error-section" v-if="requestError">
50-
<Message type="error" class="generic-error">{{ $i18n('server-error') }}</Message>
50+
<cdx-message type="error" class="generic-error">{{ $i18n('server-error') }}</cdx-message>
5151
</section>
5252
<section id="message-section">
53-
<Message type="notice" v-if="notFoundItemIds.length">
53+
<cdx-message type="notice" v-if="notFoundItemIds.length">
5454
<span>{{ $i18n('no-mismatches-found-message') }}</span>
5555
<span class="message-link" v-for="item_id in notFoundItemIds" :key="item_id">
5656
<wikit-link
5757
:href="`https://www.wikidata.org/wiki/${String(item_id)}`" target="_blank">
5858
{{labels[item_id]}} ({{item_id}})
5959
</wikit-link>
6060
</span>
61-
</Message>
61+
</cdx-message>
6262
<!-- The Results page without item_ids is used by RandomizeController. -->
63-
<Message type="notice" v-if="item_ids.length === 0">
63+
<cdx-message type="notice" v-if="item_ids.length === 0">
6464
<span>{{ $i18n('no-mismatches-available-for-review') }}</span>
65-
</Message>
66-
<Message type="warning" v-if="!user">
65+
</cdx-message>
66+
<cdx-message type="warning" v-if="!user">
6767
<span v-i18n-html:log-in-message="['/auth/login']"></span>
68-
</Message>
68+
</cdx-message>
6969
</section>
7070
<section id="results" v-if="Object.keys(results).length">
7171
<section class="item-mismatches"
@@ -83,14 +83,14 @@
8383
@decision="recordDecision"
8484
/>
8585
<footer class="mismatches-form-footer">
86-
<Message class="form-success-message" type="success" v-if="lastSubmitted === item">
86+
<cdx-message class="form-success-message" type="success" v-if="lastSubmitted === item">
8787
<span>{{ $i18n('changes-submitted-message') }}</span>
8888
<span class="message-link">
8989
<wikit-link :href="`https://www.wikidata.org/wiki/${String(item)}`" target="_blank">
9090
{{labels[item]}} ({{item}})
9191
</wikit-link>
9292
</span>
93-
</Message>
93+
</cdx-message>
9494
<div class="form-buttons">
9595
<cdx-button
9696
:disabled="!user"
@@ -138,10 +138,9 @@
138138
import { Head as InertiaHead } from '@inertiajs/inertia-vue3';
139139
import {
140140
Link as WikitLink,
141-
Checkbox,
142-
Message } from '@wmde/wikit-vue-components';
141+
Checkbox } from '@wmde/wikit-vue-components';
143142
144-
import { CdxButton, CdxIcon, CdxDialog } from "@wikimedia/codex";
143+
import { CdxButton, CdxIcon, CdxDialog, CdxMessage } from "@wikimedia/codex";
145144
import { cdxIconInfo, cdxIconArrowPrevious } from '@wikimedia/codex-icons';
146145
147146
import LoadingOverlay from '../Components/LoadingOverlay.vue';
@@ -193,10 +192,10 @@
193192
MismatchesTable,
194193
WikitLink,
195194
Checkbox,
196-
Message,
197195
CdxDialog,
198196
CdxButton,
199-
CdxIcon
197+
CdxIcon,
198+
CdxMessage
200199
},
201200
setup() {
202201
return {

‎resources/sass/app.scss‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -106,10 +106,6 @@ li {
106106
}
107107
}
108108

109-
.wikit.wikit-Message {
110-
border-radius: $border-radius-base;
111-
}
112-
113109
#error-section,
114110
#message-section,
115111
#description-section {
@@ -126,7 +122,7 @@ li {
126122
}
127123

128124
// this ensures that there will be a space if there is more than one message
129-
#message-section .wikit-Message:not(:nth-child(1)) {
125+
#message-section .cdx-message:not(:nth-child(1)) {
130126
margin-top: $dimension-layout-xsmall;
131127
}
132128

‎tests/Browser/ItemsFormTest.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -128,7 +128,7 @@ public function test_shows_error_message_from_results_url_with_invalid_input()
128128

129129
$browser->visit('/results?ids=Q42|L123')
130130
->waitFor('.home-page')
131-
->assertVisible('#message-section .wikit-Message--error.wikit');
131+
->assertVisible('#message-section .cdx-message--error');
132132
});
133133
}
134134
}

‎tests/Browser/ResultsTest.php‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ public function test_shows_table_for_existing_item_and_message_for_non_existing_
7070
$browser->visit(new ResultsPage('Q1|Q2'));
7171

7272
$browser->assertSeeIn('#results', 'Q1');
73-
$browser->assertSeeIn('.wikit-Message--notice', 'Q2');
73+
$browser->assertSeeIn('.cdx-message--notice', 'Q2');
7474
});
7575
}
7676

@@ -294,7 +294,7 @@ public function test_new_review_status_submit_triggers_confirmation_success_mess
294294
])
295295
->waitFor('@confirmation-dialog')
296296
->pause(250)
297-
->assertPresent("#item-mismatches-{$mismatch->item_id} .wikit-Message--success")
297+
->assertPresent("#item-mismatches-{$mismatch->item_id} .cdx-message--success")
298298
->assertSee('Review successfully saved for');
299299
});
300300
}

‎tests/Vue/Pages/Home.spec.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -154,7 +154,7 @@ describe('Home.vue', () => {
154154
mocks,
155155
plugins: [createTestingPinia()]
156156
}});
157-
const errorMessage = wrapper.find('#message-section .wikit-Message--error.wikit');
157+
const errorMessage = wrapper.find('#message-section .cdx-message--error');
158158
expect(errorMessage.isVisible()).toBe(true);
159159
});
160160
})

‎tests/Vue/Pages/Results.spec.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -354,7 +354,7 @@ describe('Results.vue', () => {
354354
data: { 'requestError' : true }
355355
});
356356

357-
const errorMessage = wrapper.find('#error-section .wikit-Message--error.wikit');
357+
const errorMessage = wrapper.find('#error-section .cdx-message--error');
358358
expect(errorMessage.isVisible()).toBe(true);
359359
});
360360

@@ -371,7 +371,7 @@ describe('Results.vue', () => {
371371

372372
await wrapper.vm.send( item_id );
373373

374-
const errorMessage = wrapper.find('#error-section .wikit-Message--error.wikit');
374+
const errorMessage = wrapper.find('#error-section .cdx-message--error');
375375
expect(errorMessage.exists()).toBe(false);
376376
});
377377

@@ -456,7 +456,7 @@ describe('Results.vue', () => {
456456
await wrapper.vm.send( item_id );
457457

458458
expect(wrapper.vm.lastSubmitted).toEqual('Q321');
459-
expect(wrapper.find('#item-mismatches-Q321 .wikit-Message--success').isVisible()).toBe(true);
459+
expect(wrapper.find('#item-mismatches-Q321 .cdx-message--success').isVisible()).toBe(true);
460460
});
461461

462462
it('Removes first confirmation message before submitting a second review decision', async () => {
@@ -499,13 +499,13 @@ describe('Results.vue', () => {
499499
data: { decisions, lastSubmitted}
500500
});
501501

502-
expect(wrapper.find('#item-mismatches-Q321 .wikit-Message--success').isVisible()).toBe(true);
502+
expect(wrapper.find('#item-mismatches-Q321 .cdx-message--success').isVisible()).toBe(true);
503503

504504
await wrapper.vm.send( item_id );
505505

506506
expect(wrapper.vm.lastSubmitted).toEqual('Q987');
507-
expect(wrapper.find('#item-mismatches-Q321 .wikit-Message--success').exists()).toBe(false);
508-
expect(wrapper.find('#item-mismatches-Q987 .wikit-Message--success').isVisible()).toBe(true);
507+
expect(wrapper.find('#item-mismatches-Q321 .cdx-message--success').exists()).toBe(false);
508+
expect(wrapper.find('#item-mismatches-Q987 .cdx-message--success').isVisible()).toBe(true);
509509
});
510510

511511
})

0 commit comments

Comments
 (0)