Skip to content

Commit 9d36cdc

Browse files
authored
Merge pull request #6 from webdevia/homework-6
Homework 6
2 parents 13c1030 + 3cde816 commit 9d36cdc

22 files changed

+343
-18
lines changed

src/homeworks/ts1/3_write.ts

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,7 @@
44
* Поэтому в идеале чтобы функции возвращали случайные данные, но в то же время не абракадабру.
55
* В целом сделайте так, как вам будет удобно.
66
* */
7-
import crypto from 'crypto';
8-
import { names, photos, nouns, adjectives } from './data';
7+
import { names, photos, nouns, adjectives, bankCategories, bankOperations } from './data';
98

109
type Category = {
1110
id: string;
@@ -24,7 +23,7 @@ type Product = {
2423
category: Category;
2524
};
2625

27-
type Operation = Cost | Profit;
26+
export type Operation = Cost | Profit;
2827

2928
type Cost = {
3029
id: string;
@@ -49,30 +48,30 @@ type Profit = {
4948
const getRandomItemFromArray = <T>(arr: T[]): T => arr[Math.floor(Math.random() * arr.length)];
5049
const getRandomNumber = (min: number, max: number): number => Math.floor(Math.random() * (max - min + 1)) + min;
5150
const getRandomDescription = (nouns: string[], adjectives: string[]): string => {
52-
const fourAdjectives = [...Array(4)].map(() => getRandomItemFromArray(adjectives)).join(' ');
51+
const someAdjectives = [...Array(50)].map(() => getRandomItemFromArray(adjectives)).join(' ');
5352
const noun = getRandomItemFromArray(nouns);
54-
return `${fourAdjectives} ${noun}`;
53+
return `${someAdjectives} ${noun}`;
5554
};
56-
const getRandomId = crypto.randomUUID;
55+
const getRandomId = () => `${getRandomNumber(1000, 9999)}-${getRandomNumber(1000, 9999)}`;
5756
const createRandomCategory = (): Category => ({
5857
id: getRandomId(),
59-
name: getRandomItemFromArray(names),
58+
name: getRandomItemFromArray(bankCategories),
6059
photo: getRandomItemFromArray(photos),
6160
});
6261

6362
const createRandomCost = (createdAt: string): Cost => ({
6463
id: getRandomId(),
65-
name: getRandomItemFromArray(names),
64+
name: getRandomItemFromArray(bankOperations),
6665
desc: getRandomDescription(nouns, adjectives),
6766
createdAt,
68-
amount: getRandomNumber(100, 1000),
67+
amount: getRandomNumber(-100, -1000),
6968
category: createRandomCategory(),
7069
type: 'Cost',
7170
});
7271

7372
const createRandomProfit = (createdAt: string): Profit => ({
7473
id: getRandomId(),
75-
name: getRandomItemFromArray(names),
74+
name: getRandomItemFromArray(bankOperations),
7675
desc: getRandomDescription(nouns, adjectives),
7776
createdAt,
7877
amount: getRandomNumber(100, 1000),

src/homeworks/ts1/data.ts

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,125 @@
1+
export const bankCategories = [
2+
'Account Management',
3+
'Transactions',
4+
'Loan Services',
5+
'Credit Card Services',
6+
'Investment Services',
7+
'Online and Mobile Banking',
8+
'Customer Support',
9+
'Foreign Exchange Services',
10+
'Other Services',
11+
'Security Services',
12+
'Digital Banking',
13+
'Insurance Services',
14+
'Financial Planning',
15+
'Mortgage Services',
16+
'Business Banking Services',
17+
'ATM Services',
18+
];
19+
20+
export const bankOperations = [
21+
'Open Savings Account',
22+
'Close Savings Account',
23+
'Open Checking Account',
24+
'Close Checking Account',
25+
'Open Fixed Deposit Account',
26+
'Close Fixed Deposit Account',
27+
'Open Joint Account',
28+
'Close Joint Account',
29+
'Update Account Information',
30+
'Change Account Type',
31+
'Deposit Cash',
32+
'Withdraw Cash',
33+
'Transfer Funds',
34+
'Receive Funds',
35+
'Pay Bills',
36+
'Online Payment',
37+
'Recurring Payments',
38+
'Stop Payment Request',
39+
'Issue Checks',
40+
'Cancel Checks',
41+
'Apply for Personal Loan',
42+
'Apply for Home Loan',
43+
'Apply for Auto Loan',
44+
'Apply for Student Loan',
45+
'Pay Loan Installment',
46+
'Pay Loan Off Early',
47+
'Refinance Loan',
48+
'Loan Balance Inquiry',
49+
'Loan Statement Request',
50+
'Loan Insurance',
51+
'Apply for Credit Card',
52+
'Activate Credit Card',
53+
'Block Credit Card',
54+
'Unblock Credit Card',
55+
'Increase Credit Limit',
56+
'Decrease Credit Limit',
57+
'Pay Credit Card Bill',
58+
'Credit Card Balance Inquiry',
59+
'Report Lost Credit Card',
60+
'Credit Card Statement Request',
61+
'Open Investment Account',
62+
'Close Investment Account',
63+
'Buy Stocks',
64+
'Sell Stocks',
65+
'Buy Bonds',
66+
'Sell Bonds',
67+
'Mutual Fund Investment',
68+
'Withdraw Investment',
69+
'Investment Account Statement',
70+
'Investment Advisory Services',
71+
'Register for Online Banking',
72+
'Login to Online Banking',
73+
'Reset Online Banking Password',
74+
'Mobile Banking Registration',
75+
'Mobile Banking App Download',
76+
'Mobile Check Deposit',
77+
'Online Fund Transfer',
78+
'View Account Statements',
79+
'Set Up Alerts',
80+
'Online Bill Payment',
81+
'Account Inquiry',
82+
'Transaction Dispute',
83+
'Account Lock/Unlock',
84+
'Complaint Registration',
85+
'General Banking Information',
86+
'ATM Card Issues',
87+
'Branch Locator',
88+
'Update Contact Details',
89+
'Request for Document Copies',
90+
'Fraud Alert Reporting',
91+
'Currency Exchange',
92+
'Foreign Currency Account Opening',
93+
'International Fund Transfer',
94+
'International Check Deposit',
95+
'Foreign Currency Loan',
96+
'Forex Card Application',
97+
'Forex Card Reload',
98+
'Forex Card Balance Inquiry',
99+
'Currency Rate Inquiry',
100+
'Foreign Draft Issue',
101+
'Safe Deposit Box Rental',
102+
'Safe Deposit Box Access',
103+
'Notary Services',
104+
'Document Certification',
105+
'Tax Payment Services',
106+
'Utility Bill Payments',
107+
'Property Valuation Services',
108+
'Mortgage Services',
109+
'Wealth Management Services',
110+
'Retirement Planning Services',
111+
'Activate Two-Factor Authentication',
112+
'Deactivate Two-Factor Authentication',
113+
'Change PIN/Password',
114+
'Set Up Security Questions',
115+
'Biometric Authentication Setup',
116+
'Review Security Settings',
117+
'Security Alerts & Notifications',
118+
'Anti-Money Laundering Reports',
119+
'Suspicious Activity Monitoring',
120+
'Data Privacy Requests',
121+
];
122+
1123
export const names = [
2124
'Emma',
3125
'Liam',

src/shared/icome-expenses-accounting/operation-container/OperationContainer.module.scss

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,5 @@
33
border: 1px solid #ddd;
44
border-radius: 5px;
55
padding: 15px;
6-
margin-bottom: 20px;
76
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
87
}
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
.operation-dynamic-list {
2+
display: flex;
3+
flex-direction: column;
4+
gap: 15px;
5+
}
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import React, { useCallback, useRef, useState } from 'react';
2+
import { OperationList } from '../operation-list/OperationList';
3+
import { createRandomOperation, Operation } from '../../../homeworks/ts1/3_write';
4+
import s from './OperationDynamicList.module.scss';
5+
6+
const createOpearation = () => createRandomOperation(new Date().toLocaleDateString());
7+
const createBatchOperations = (nr: number) => Array.from(Array(nr), () => createOpearation());
8+
9+
export const OperationDynamicList = () => {
10+
const [operations, setOperations] = useState<Operation[]>(createBatchOperations(5));
11+
const addMoreOperations = () => setOperations((prev) => [...prev, ...createBatchOperations(5)]);
12+
const observer = useRef<IntersectionObserver | null>(null);
13+
14+
const lastOperationRef = useCallback((node: HTMLDivElement) => {
15+
observer.current && observer.current.disconnect();
16+
observer.current = new IntersectionObserver((items) => items[0].isIntersecting && addMoreOperations());
17+
node && observer.current.observe(node);
18+
}, []);
19+
20+
return (
21+
<div className={s['operation-dynamic-list']}>
22+
<OperationList items={operations} />
23+
<div ref={lastOperationRef}></div>
24+
</div>
25+
);
26+
};
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
.container {
2+
display: flex;
3+
flex-direction: column;
4+
gap: 20px;
5+
}
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import React, { useState } from 'react';
2+
import { OperationList } from '../operation-list/OperationList';
3+
import { Button } from '../../button/Button';
4+
import { createRandomOperation, Operation } from '../../../homeworks/ts1/3_write';
5+
import s from './OperationListAddMore.module.scss';
6+
7+
const createOpearation = () => createRandomOperation(new Date().toLocaleDateString());
8+
const createBatchOperations = (nr: number) => Array.from(Array(nr), () => createOpearation());
9+
10+
export const OperationListAddMore = () => {
11+
const [operations, setOperations] = useState<Operation[]>(createBatchOperations(2));
12+
const addMoreOperations = () => setOperations((prev) => [...prev, ...createBatchOperations(2)]);
13+
14+
return (
15+
<div className={s.container}>
16+
<OperationList items={operations} />
17+
<Button onClick={addMoreOperations}>Показать еще</Button>
18+
</div>
19+
);
20+
};
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
.operation-list {
2+
display: flex;
3+
flex-direction: column;
4+
gap: 15px;
5+
}
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import React from 'react';
2+
import { OperationDetail } from '../operation-detail/OperationDetail';
3+
import { Operation as OperationProps } from '../../../homeworks/ts1/3_write';
4+
import s from './OperationList.module.scss';
5+
6+
type OperationItemProps = Omit<OperationProps, 'id'>;
7+
8+
const OperationItem = (data: OperationItemProps) => (
9+
<OperationDetail
10+
amount={data.amount}
11+
category={data.category.name}
12+
date={data.createdAt}
13+
description={data.desc}
14+
title={data.name}
15+
/>
16+
);
17+
18+
type OperationListProps = {
19+
items: OperationProps[];
20+
};
21+
22+
export const OperationList = ({ items }: OperationListProps) => (
23+
<div className={s['operation-list']}>
24+
{items.map((item) => {
25+
const { id, ...rest } = item;
26+
return <OperationItem {...rest} key={id} />;
27+
})}
28+
</div>
29+
);

src/shared/icome-expenses-accounting/operation/Operation.module.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,3 +19,7 @@
1919
font-weight: bold;
2020
margin-top: 10px;
2121
}
22+
23+
.cost {
24+
color: crimson;
25+
}

0 commit comments

Comments
 (0)