Skip to content

Commit

Permalink
feat(RSS-ECOMM-3_25): create pages components (#214)
Browse files Browse the repository at this point in the history
* feat: add base page components

* docs: update PR template

* fix: link styles

* fix: button naming

* Apply suggestions from code review

Co-authored-by: Max <[email protected]>

---------

Co-authored-by: Max <[email protected]>
  • Loading branch information
stardustmeg and Kleostro authored May 10, 2024
1 parent a5d0b7e commit 61fb5a8
Show file tree
Hide file tree
Showing 20 changed files with 395 additions and 21 deletions.
2 changes: 1 addition & 1 deletion .github/pull_request_template.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
- [ ] sprint and issue number (e.g. `RSS-ECOMM-3_01`, where `3` - is the sprint number and `01` - is the issue number)
- [ ] short description

👀 Example: `feat(RSS-ECOMM-2_01): description`
👀 Example: `feat(RSS-ECOMM-3_01): description`

## PR Description 🧙‍♂️

Expand Down
26 changes: 26 additions & 0 deletions src/pages/AboutUsPage/model/AboutUsPageModel.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import type { Page } from '@/shared/types/common.ts';

import getStore from '@/shared/Store/Store.ts';
import { setCurrentPage } from '@/shared/Store/actions.ts';
import { PAGE_ID } from '@/shared/constants/pages.ts';

import AboutUsPageView from '../view/AboutUsPageView.ts';

class AboutUsPageModel implements Page {
private view: AboutUsPageView;

constructor(parent: HTMLDivElement) {
this.view = new AboutUsPageView(parent);
this.init();
}

private init(): void {
getStore().dispatch(setCurrentPage(PAGE_ID.ABOUT_US_PAGE));
}

public getHTML(): HTMLDivElement {
return this.view.getHTML();
}
}

export default AboutUsPageModel;
31 changes: 31 additions & 0 deletions src/pages/AboutUsPage/view/AboutUsPageView.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import createBaseElement from '@/shared/utils/createBaseElement.ts';

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

class AboutUsPageView {
private page: HTMLDivElement;

private parent: HTMLDivElement;

constructor(parent: HTMLDivElement) {
this.parent = parent;
this.parent.innerHTML = '';
this.page = this.createHTML();
}

private createHTML(): HTMLDivElement {
this.page = createBaseElement({
cssClasses: [styles.aboutUsPage],
tag: 'div',
});

this.parent.append(this.page);

return this.page;
}

public getHTML(): HTMLDivElement {
return this.page;
}
}
export default AboutUsPageView;
17 changes: 17 additions & 0 deletions src/pages/AboutUsPage/view/aboutUsPageView.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
.aboutUsPage {
position: relative;
display: block;
padding: 0 var(--small-offset);
animation: show 0.2s ease-out forwards;
}

@keyframes show {
0% {
opacity: 0;
}

100% {
display: block;
opacity: 1;
}
}
26 changes: 26 additions & 0 deletions src/pages/CartPage/model/CartPageModel.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import type { Page } from '@/shared/types/common.ts';

import getStore from '@/shared/Store/Store.ts';
import { setCurrentPage } from '@/shared/Store/actions.ts';
import { PAGE_ID } from '@/shared/constants/pages.ts';

import CartPageView from '../view/CartPageView.ts';

class CartPageModel implements Page {
private view: CartPageView;

constructor(parent: HTMLDivElement) {
this.view = new CartPageView(parent);
this.init();
}

private init(): void {
getStore().dispatch(setCurrentPage(PAGE_ID.CART_PAGE));
}

public getHTML(): HTMLDivElement {
return this.view.getHTML();
}
}

export default CartPageModel;
31 changes: 31 additions & 0 deletions src/pages/CartPage/view/CartPageView.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import createBaseElement from '@/shared/utils/createBaseElement.ts';

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

class CartPageView {
private page: HTMLDivElement;

private parent: HTMLDivElement;

constructor(parent: HTMLDivElement) {
this.parent = parent;
this.parent.innerHTML = '';
this.page = this.createHTML();
}

private createHTML(): HTMLDivElement {
this.page = createBaseElement({
cssClasses: [styles.cartPage],
tag: 'div',
});

this.parent.append(this.page);

return this.page;
}

public getHTML(): HTMLDivElement {
return this.page;
}
}
export default CartPageView;
17 changes: 17 additions & 0 deletions src/pages/CartPage/view/cartPageView.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
.cartPage {
position: relative;
display: block;
padding: 0 var(--small-offset);
animation: show 0.2s ease-out forwards;
}

@keyframes show {
0% {
opacity: 0;
}

100% {
display: block;
opacity: 1;
}
}
26 changes: 26 additions & 0 deletions src/pages/CatalogPage/model/CatalogPageModel.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import type { Page } from '@/shared/types/common.ts';

import getStore from '@/shared/Store/Store.ts';
import { setCurrentPage } from '@/shared/Store/actions.ts';
import { PAGE_ID } from '@/shared/constants/pages.ts';

import CatalogPageView from '../view/CatalogPageView.ts';

class CatalogPageModel implements Page {
private view: CatalogPageView;

constructor(parent: HTMLDivElement) {
this.view = new CatalogPageView(parent);
this.init();
}

private init(): void {
getStore().dispatch(setCurrentPage(PAGE_ID.CATALOG_PAGE));
}

public getHTML(): HTMLDivElement {
return this.view.getHTML();
}
}

export default CatalogPageModel;
31 changes: 31 additions & 0 deletions src/pages/CatalogPage/view/CatalogPageView.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import createBaseElement from '@/shared/utils/createBaseElement.ts';

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

class CatalogPageView {
private page: HTMLDivElement;

private parent: HTMLDivElement;

constructor(parent: HTMLDivElement) {
this.parent = parent;
this.parent.innerHTML = '';
this.page = this.createHTML();
}

private createHTML(): HTMLDivElement {
this.page = createBaseElement({
cssClasses: [styles.catalogPage],
tag: 'div',
});

this.parent.append(this.page);

return this.page;
}

public getHTML(): HTMLDivElement {
return this.page;
}
}
export default CatalogPageView;
17 changes: 17 additions & 0 deletions src/pages/CatalogPage/view/catalogPageView.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
.catalogPage {
position: relative;
display: block;
padding: 0 var(--small-offset);
animation: show 0.2s ease-out forwards;
}

@keyframes show {
0% {
opacity: 0;
}

100% {
display: block;
opacity: 1;
}
}
26 changes: 26 additions & 0 deletions src/pages/ItemPage/model/ItemPageModel.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import type { Page } from '@/shared/types/common.ts';

import getStore from '@/shared/Store/Store.ts';
import { setCurrentPage } from '@/shared/Store/actions.ts';
import { PAGE_ID } from '@/shared/constants/pages.ts';

import ItemPageView from '../view/ItemPageView.ts';

class ItemPageModel implements Page {
private view: ItemPageView;

constructor(parent: HTMLDivElement) {
this.view = new ItemPageView(parent);
this.init();
}

private init(): void {
getStore().dispatch(setCurrentPage(PAGE_ID.ITEM_PAGE));
}

public getHTML(): HTMLDivElement {
return this.view.getHTML();
}
}

export default ItemPageModel;
31 changes: 31 additions & 0 deletions src/pages/ItemPage/view/ItemPageView.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import createBaseElement from '@/shared/utils/createBaseElement.ts';

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

class ItemPageView {
private page: HTMLDivElement;

private parent: HTMLDivElement;

constructor(parent: HTMLDivElement) {
this.parent = parent;
this.parent.innerHTML = '';
this.page = this.createHTML();
}

private createHTML(): HTMLDivElement {
this.page = createBaseElement({
cssClasses: [styles.itemPage],
tag: 'div',
});

this.parent.append(this.page);

return this.page;
}

public getHTML(): HTMLDivElement {
return this.page;
}
}
export default ItemPageView;
17 changes: 17 additions & 0 deletions src/pages/ItemPage/view/itemPageView.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
.itemPage {
position: relative;
display: block;
padding: 0 var(--small-offset);
animation: show 0.2s ease-out forwards;
}

@keyframes show {
0% {
opacity: 0;
}

100% {
display: block;
opacity: 1;
}
}
26 changes: 26 additions & 0 deletions src/pages/UserProfilePage/model/UserProfilePageModel.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import type { Page } from '@/shared/types/common.ts';

import getStore from '@/shared/Store/Store.ts';
import { setCurrentPage } from '@/shared/Store/actions.ts';
import { PAGE_ID } from '@/shared/constants/pages.ts';

import UserProfilePageView from '../view/UserProfilePageView.ts';

class UserProfilePageModel implements Page {
private view: UserProfilePageView;

constructor(parent: HTMLDivElement) {
this.view = new UserProfilePageView(parent);
this.init();
}

private init(): void {
getStore().dispatch(setCurrentPage(PAGE_ID.USER_PROFILE_PAGE));
}

public getHTML(): HTMLDivElement {
return this.view.getHTML();
}
}

export default UserProfilePageModel;
31 changes: 31 additions & 0 deletions src/pages/UserProfilePage/view/UserProfilePageView.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import createBaseElement from '@/shared/utils/createBaseElement.ts';

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

class UserProfilePageView {
private page: HTMLDivElement;

private parent: HTMLDivElement;

constructor(parent: HTMLDivElement) {
this.parent = parent;
this.parent.innerHTML = '';
this.page = this.createHTML();
}

private createHTML(): HTMLDivElement {
this.page = createBaseElement({
cssClasses: [styles.userProfilePage],
tag: 'div',
});

this.parent.append(this.page);

return this.page;
}

public getHTML(): HTMLDivElement {
return this.page;
}
}
export default UserProfilePageView;
17 changes: 17 additions & 0 deletions src/pages/UserProfilePage/view/userProfilePageView.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
.userProfilePage {
position: relative;
display: block;
padding: 0 var(--small-offset);
animation: show 0.2s ease-out forwards;
}

@keyframes show {
0% {
opacity: 0;
}

100% {
display: block;
opacity: 1;
}
}
Loading

0 comments on commit 61fb5a8

Please sign in to comment.