Skip to content

Commit

Permalink
fix: update text content
Browse files Browse the repository at this point in the history
  • Loading branch information
@stardustmeg
stardustmeg committed Jun 17, 2024
1 parent b3415c5 commit 1da4fe5
Show file tree
Hide file tree
Showing 18 changed files with 207 additions and 234 deletions.
9 changes: 4 additions & 5 deletions src/entities/CountBadge/view/CountBadgeView.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,18 +8,15 @@ class CountBadgeView {
private countBadgeWrap: HTMLDivElement;

constructor() {
this.countBadgeWrap = this.createHTML();
this.countBadge = this.createBadge();
this.countBadgeWrap = this.createHTML();
}

private createBadge(): HTMLSpanElement {
this.countBadge = createBaseElement({
return createBaseElement({
cssClasses: [styles.badge],
tag: 'span',
});
this.countBadgeWrap.append(this.countBadge);

return this.countBadge;
}

private createHTML(): HTMLDivElement {
Expand All @@ -28,6 +25,8 @@ class CountBadgeView {
tag: 'div',
});

this.countBadgeWrap.append(this.countBadge);

return this.countBadgeWrap;
}

Expand Down
56 changes: 21 additions & 35 deletions src/entities/UserAddress/view/UserAddressView.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,14 @@ import type { Address } from '@/shared/types/user';
import ButtonModel from '@/shared/Button/model/ButtonModel.ts';
import observeStore, { selectCurrentLanguage } from '@/shared/Store/observer.ts';
import COUNTRIES_LIST from '@/shared/constants/countriesList.ts';
import { ADDRESS, ADDRESS_TEXT, type AddressType } from '@/shared/constants/forms.ts';
import { ADDRESS, ADDRESS_TEXT, ADDRESS_TEXT_KEY, type AddressType } from '@/shared/constants/forms.ts';
import SVG_DETAIL from '@/shared/constants/svg.ts';
import TOOLTIP_TEXT, { TOOLTIP_TEXT_KEY } from '@/shared/constants/tooltip.ts';
import createBaseElement from '@/shared/utils/createBaseElement.ts';
import createSVGUse from '@/shared/utils/createSVGUse.ts';
import findKeyByValue from '@/shared/utils/findKeyByValue.ts';
import getCurrentLanguage from '@/shared/utils/getCurrentLanguage.ts';
import observeCurrentLanguage from '@/shared/utils/observeCurrentLanguage.ts';

import styles from './userAddressView.module.scss';

Expand Down Expand Up @@ -45,6 +46,8 @@ class UserAddressView {
this.streetNameSpan = this.createStreetNameSpan();
this.labelsWrapper = this.createLabelsWrapper();
this.view = this.createHTML(types, inactiveTypes);

this.observeStoreChanges();
}

private createCitySpan(): HTMLSpanElement {
Expand All @@ -54,14 +57,6 @@ class UserAddressView {
tag: 'span',
});

observeStore(selectCurrentLanguage, () => {
const text = ADDRESS_TEXT[getCurrentLanguage()].CITY;
const textNode = [...this.citySpan.childNodes].find((child) => child.nodeType === Node.TEXT_NODE);
if (textNode) {
textNode.textContent = text;
}
});

const accentSpan = createBaseElement({
cssClasses: [styles.accentSpan],
innerContent: this.currentAddress.city,
Expand Down Expand Up @@ -110,10 +105,6 @@ class UserAddressView {
svg.append(createSVGUse(SVG_DETAIL.DELETE));
this.deleteButton.getHTML().append(svg);

observeStore(selectCurrentLanguage, () => {
this.deleteButton.getHTML().title = TOOLTIP_TEXT[getCurrentLanguage()].DELETE_ADDRESS;
});

return this.deleteButton;
}

Expand All @@ -127,10 +118,6 @@ class UserAddressView {
svg.append(createSVGUse(SVG_DETAIL.EDIT));
this.editButton.getHTML().append(svg);

observeStore(selectCurrentLanguage, () => {
this.editButton.getHTML().title = TOOLTIP_TEXT[getCurrentLanguage()].EDIT_ADDRESS;
});

return this.editButton;
}

Expand Down Expand Up @@ -183,11 +170,10 @@ class UserAddressView {
}

private createLabelsWrapper(): HTMLDivElement {
this.labelsWrapper = createBaseElement({
return createBaseElement({
cssClasses: [styles.labelsWrapper],
tag: 'div',
});
return this.labelsWrapper;
}

private createPostalCodeSpan(): HTMLSpanElement {
Expand All @@ -197,14 +183,6 @@ class UserAddressView {
tag: 'span',
});

observeStore(selectCurrentLanguage, () => {
const text = ADDRESS_TEXT[getCurrentLanguage()].POSTAL_CODE;
const textNode = [...this.postalCodeSpan.childNodes].find((child) => child.nodeType === Node.TEXT_NODE);
if (textNode) {
textNode.textContent = text;
}
});

const accentSpan = createBaseElement({
cssClasses: [styles.accentSpan],
innerContent: this.currentAddress.postalCode,
Expand All @@ -222,14 +200,6 @@ class UserAddressView {
tag: 'span',
});

observeStore(selectCurrentLanguage, () => {
const text = ADDRESS_TEXT[getCurrentLanguage()].STREET;
const textNode = [...this.streetNameSpan.childNodes].find((child) => child.nodeType === Node.TEXT_NODE);
if (textNode) {
textNode.textContent = text;
}
});

const accentSpan = createBaseElement({
cssClasses: [styles.accentSpan],
innerContent: this.currentAddress.streetName,
Expand All @@ -240,6 +210,22 @@ class UserAddressView {
return this.streetNameSpan;
}

private observeStoreChanges(): void {
observeStore(selectCurrentLanguage, () => {
const text = ADDRESS_TEXT[getCurrentLanguage()].CITY;
const textNode = [...this.citySpan.childNodes].find((child) => child.nodeType === Node.TEXT_NODE);
if (textNode) {
textNode.textContent = text;
}

this.deleteButton.getHTML().title = TOOLTIP_TEXT[getCurrentLanguage()].DELETE_ADDRESS;
this.editButton.getHTML().title = TOOLTIP_TEXT[getCurrentLanguage()].EDIT_ADDRESS;
});

observeCurrentLanguage(this.postalCodeSpan, ADDRESS_TEXT, ADDRESS_TEXT_KEY.POSTAL_CODE);
observeCurrentLanguage(this.streetNameSpan, ADDRESS_TEXT, ADDRESS_TEXT_KEY.STREET);
}

private setActiveAddressLabel(ActiveType: AddressType, inactive?: boolean): void {
let addressType = null;
switch (ActiveType) {
Expand Down
9 changes: 4 additions & 5 deletions src/features/AddressAdd/view/AddressAddView.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,14 +16,15 @@ class AddressAddView {
this.saveChangesButton = this.createSaveChangesButton();
this.cancelButton = this.createCancelButton();
this.view = this.createHTML();

this.saveChangesButton.setDisabled();
}

private createCancelButton(): ButtonModel {
this.cancelButton = new ButtonModel({
return new ButtonModel({
classes: [styles.cancelButton],
text: BUTTON_TEXT[getCurrentLanguage()].CANCEL,
});
return this.cancelButton;
}

private createHTML(): HTMLFormElement {
Expand All @@ -36,15 +37,13 @@ class AddressAddView {
}

private createSaveChangesButton(): ButtonModel {
this.saveChangesButton = new ButtonModel({
return new ButtonModel({
attrs: {
type: BUTTON_TYPE.SUBMIT,
},
classes: [styles.saveChangesButton],
text: BUTTON_TEXT[getCurrentLanguage()].ADD_ADDRESS,
});
this.saveChangesButton.setDisabled();
return this.saveChangesButton;
}

public getCancelButton(): ButtonModel {
Expand Down
10 changes: 4 additions & 6 deletions src/features/AddressEdit/view/AddressEditView.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,33 +16,31 @@ class AddressEditView {
this.saveChangesButton = this.createSaveChangesButton();
this.cancelButton = this.createCancelButton();
this.view = this.createHTML();

this.saveChangesButton.setDisabled();
}

private createCancelButton(): ButtonModel {
this.cancelButton = new ButtonModel({
return new ButtonModel({
classes: [styles.cancelButton],
text: BUTTON_TEXT[getCurrentLanguage()].CANCEL,
});
return this.cancelButton;
}

private createHTML(): HTMLFormElement {
this.view = createBaseElement({
cssClasses: [styles.wrapper],
tag: 'form',
});

this.view.append(this.saveChangesButton.getHTML(), this.cancelButton.getHTML());
return this.view;
}

private createSaveChangesButton(): ButtonModel {
this.saveChangesButton = new ButtonModel({
return new ButtonModel({
classes: [styles.saveChangesButton],
text: BUTTON_TEXT[getCurrentLanguage()].SAVE_CHANGES,
});
this.saveChangesButton.setDisabled();
return this.saveChangesButton;
}

public getCancelButton(): ButtonModel {
Expand Down
20 changes: 9 additions & 11 deletions src/features/PasswordEdit/view/PasswordEditView.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,14 +37,15 @@ class PasswordEditView {
this.oldPasswordField = this.createOldPasswordField();
this.newPasswordField = this.createNewPasswordField();
this.view = this.createHTML();

this.submitButton.setDisabled();
}

private createCancelButton(): ButtonModel {
this.cancelButton = new ButtonModel({
return new ButtonModel({
classes: [styles.cancelButton],
text: BUTTON_TEXT[getCurrentLanguage()].CANCEL,
});
return this.cancelButton;
}

private createHTML(): HTMLFormElement {
Expand All @@ -65,6 +66,9 @@ class PasswordEditView {
}
});

this.switchPasswordElementSVG(INPUT_TYPE.PASSWORD, this.showOldPasswordElement);
this.switchPasswordElementSVG(INPUT_TYPE.PASSWORD, this.showNewPasswordElement);

this.view.append(this.submitButton.getHTML(), this.cancelButton.getHTML());
return this.view;
}
Expand All @@ -90,30 +94,24 @@ class PasswordEditView {
}

private createShowNewPasswordElement(): HTMLDivElement {
this.showNewPasswordElement = createBaseElement({
return createBaseElement({
cssClasses: [styles.showPasswordElement],
tag: 'div',
});
this.switchPasswordElementSVG(INPUT_TYPE.PASSWORD, this.showNewPasswordElement);
return this.showNewPasswordElement;
}

private createShowOldPasswordElement(): HTMLDivElement {
this.showOldPasswordElement = createBaseElement({
return createBaseElement({
cssClasses: [styles.showPasswordElement],
tag: 'div',
});
this.switchPasswordElementSVG(INPUT_TYPE.PASSWORD, this.showOldPasswordElement);
return this.showOldPasswordElement;
}

private createSubmitButton(): ButtonModel {
this.submitButton = new ButtonModel({
return new ButtonModel({
classes: [styles.submitButton],
text: BUTTON_TEXT[getCurrentLanguage()].SAVE_CHANGES,
});
this.submitButton.setDisabled();
return this.submitButton;
}

public getCancelButton(): ButtonModel {
Expand Down
Loading

1 comment on commit 1da4fe5

@stardustmeg
Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[sprint_5] Issue RSS-ECOMM-5_12: Check all app's text content (ru and en)

Please sign in to comment.