promote-email-templates 0.0.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.eslintrc.js +22 -0
- package/.prettierrc.json +7 -0
- package/dist/index.d.mts +467 -0
- package/dist/index.d.ts +467 -0
- package/dist/index.js +1123 -0
- package/dist/index.mjs +1068 -0
- package/emails/admin/abort-order-request.tsx +58 -0
- package/emails/admin/index.ts +2 -0
- package/emails/admin/revert-payment-request-admin.tsx +54 -0
- package/emails/all/index.ts +1 -0
- package/emails/all/welcome.tsx +104 -0
- package/emails/brand/evidences-accepted-brand.tsx +59 -0
- package/emails/brand/evidences-submitted-brand.tsx +65 -0
- package/emails/brand/index.ts +6 -0
- package/emails/brand/new-order-created-brand.tsx +74 -0
- package/emails/brand/order-accepted-brand.tsx +63 -0
- package/emails/brand/order-cancelled-brand.tsx +68 -0
- package/emails/brand/order-rejected-brand.tsx +79 -0
- package/emails/creator/evidences-approved-creator.tsx +62 -0
- package/emails/creator/evidences-rejected-creator.tsx +74 -0
- package/emails/creator/index.ts +5 -0
- package/emails/creator/new-order-created-creator.tsx +70 -0
- package/emails/creator/order-cancelled-creator.tsx +69 -0
- package/emails/creator/order-payment-creator.tsx +58 -0
- package/emails/index.ts +5 -0
- package/emails/shared/components/base-head.tsx +19 -0
- package/emails/shared/components/comment-component.tsx +32 -0
- package/emails/shared/components/footer.tsx +84 -0
- package/emails/shared/components/header.tsx +24 -0
- package/emails/shared/components/new-order-info.tsx +60 -0
- package/emails/shared/components/payment-amount.tsx +37 -0
- package/emails/shared/components/user-Info.tsx +55 -0
- package/emails/shared/index.ts +3 -0
- package/emails/shared/styles.ts +72 -0
- package/emails/shared/types.ts +179 -0
- package/emails/shared/values.ts +19 -0
- package/package.json +32 -0
- package/readme.md +27 -0
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import { Body, Container, Html, Link, Preview, Text } from '@react-email/components';
|
|
2
|
+
import { baseContainer, baseContentContainer, baseText, button, link, main, rootStyles } from '../shared/styles';
|
|
3
|
+
import Header from '../shared/components/header';
|
|
4
|
+
import Footer from '../shared/components/footer';
|
|
5
|
+
import BaseHead from '../shared/components/base-head';
|
|
6
|
+
import UserInfo from '../shared/components/user-Info';
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
import { appRoutes, assetsBasePath } from '../shared/values';
|
|
9
|
+
import { AbortOrderRequestProps, USER_ROLES } from '../shared/types';
|
|
10
|
+
|
|
11
|
+
export default function AbortOrderRequest(props: AbortOrderRequestProps) {
|
|
12
|
+
const requestedBy = {
|
|
13
|
+
[USER_ROLES.BRAND]: 'Empresa',
|
|
14
|
+
[USER_ROLES.CREATOR]: 'Influencer',
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
return (
|
|
18
|
+
<Html style={rootStyles}>
|
|
19
|
+
<BaseHead />
|
|
20
|
+
<Preview>Pedido de cancelamento</Preview>
|
|
21
|
+
<Body style={{ ...main, ...baseContainer }}>
|
|
22
|
+
<Header />
|
|
23
|
+
|
|
24
|
+
<UserInfo photo={`${assetsBasePath}/icons/logo-icon-colored.png`} name={'Promote Team'} userType={USER_ROLES.BRAND} />
|
|
25
|
+
|
|
26
|
+
<Container style={{ ...baseContentContainer }}>
|
|
27
|
+
<Text style={baseText}>Olá Admin Team</Text>
|
|
28
|
+
<Text style={baseText}>
|
|
29
|
+
Foi efectuado um novo pedido de cancelamento da{' '}
|
|
30
|
+
<Link href={appRoutes.adminOrderDetails(props.order.id)} target={'_blank'} style={link}>
|
|
31
|
+
ordem #{props.order.id}.
|
|
32
|
+
</Link>{' '}
|
|
33
|
+
<br />
|
|
34
|
+
</Text>
|
|
35
|
+
|
|
36
|
+
<Text style={baseText}>O pedido de cancelamento foi feito pelo/a {requestedBy[props.requestedBy]}</Text>
|
|
37
|
+
</Container>
|
|
38
|
+
|
|
39
|
+
<Container style={{ ...baseContentContainer, marginTop: '25px' }}>
|
|
40
|
+
<Link href={appRoutes.adminOrderDetails(props.order.id)} style={{ ...button, width: '150px' }}>
|
|
41
|
+
VER PEDIDO
|
|
42
|
+
</Link>
|
|
43
|
+
</Container>
|
|
44
|
+
|
|
45
|
+
<Footer />
|
|
46
|
+
</Body>
|
|
47
|
+
</Html>
|
|
48
|
+
);
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
AbortOrderRequest.PreviewProps = {
|
|
52
|
+
order: {
|
|
53
|
+
id: '123',
|
|
54
|
+
},
|
|
55
|
+
requestedBy: USER_ROLES.CREATOR,
|
|
56
|
+
} satisfies AbortOrderRequestProps;
|
|
57
|
+
|
|
58
|
+
export { AbortOrderRequest };
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { Body, Container, Html, Link, Preview, Text } from '@react-email/components';
|
|
2
|
+
import { baseContainer, baseContentContainer, baseText, button, link, main, rootStyles } from '../shared/styles';
|
|
3
|
+
import Header from '../shared/components/header';
|
|
4
|
+
import Footer from '../shared/components/footer';
|
|
5
|
+
import BaseHead from '../shared/components/base-head';
|
|
6
|
+
import UserInfo from '../shared/components/user-Info';
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
import { appRoutes, assetsBasePath } from '../shared/values';
|
|
9
|
+
import { RevertPaymentRequestAdminProps, USER_ROLES } from '../shared/types';
|
|
10
|
+
import PaymentAmount from '../shared/components/payment-amount';
|
|
11
|
+
|
|
12
|
+
export default function RevertPaymentRequestAdmin(props: RevertPaymentRequestAdminProps) {
|
|
13
|
+
return (
|
|
14
|
+
<Html style={rootStyles}>
|
|
15
|
+
<BaseHead />
|
|
16
|
+
<Preview>Pedido de reversão de pagamento</Preview>
|
|
17
|
+
<Body style={{ ...main, ...baseContainer }}>
|
|
18
|
+
<Header />
|
|
19
|
+
|
|
20
|
+
<UserInfo photo={`${assetsBasePath}/icons/logo-icon-colored.png`} name={'Promote Team'} userType={USER_ROLES.BRAND} />
|
|
21
|
+
|
|
22
|
+
<Container style={{ ...baseContentContainer }}>
|
|
23
|
+
<Text style={baseText}>Olá Promote team,</Text>
|
|
24
|
+
<Text style={baseText}>
|
|
25
|
+
O pagamento da{' '}
|
|
26
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} target={'_blank'} style={link}>
|
|
27
|
+
ordem #{props.order.id}
|
|
28
|
+
</Link>{' '}
|
|
29
|
+
deve ser revertido.
|
|
30
|
+
</Text>
|
|
31
|
+
</Container>
|
|
32
|
+
|
|
33
|
+
<PaymentAmount totalAmount={props.totalAmount} />
|
|
34
|
+
|
|
35
|
+
<Container style={{ ...baseContentContainer, marginTop: '25px' }}>
|
|
36
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} style={{ ...button, width: '150px' }}>
|
|
37
|
+
VER PEDIDO
|
|
38
|
+
</Link>
|
|
39
|
+
</Container>
|
|
40
|
+
|
|
41
|
+
<Footer />
|
|
42
|
+
</Body>
|
|
43
|
+
</Html>
|
|
44
|
+
);
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
RevertPaymentRequestAdmin.PreviewProps = {
|
|
48
|
+
order: {
|
|
49
|
+
id: '123',
|
|
50
|
+
},
|
|
51
|
+
totalAmount: '1000,00',
|
|
52
|
+
} satisfies RevertPaymentRequestAdminProps;
|
|
53
|
+
|
|
54
|
+
export { RevertPaymentRequestAdmin };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './welcome';
|
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
import { Body, Container, Heading, Html, Img, Link, Preview, Text } from '@react-email/components';
|
|
2
|
+
import { baseContainer, baseContentContainer, baseText, button, colors, link, main, rootStyles } from '../shared/styles';
|
|
3
|
+
import { USER_ROLES, WelcomeTemplateProps } from '../shared/types';
|
|
4
|
+
import { appRoutes, assetsBasePath } from '../shared/values';
|
|
5
|
+
import Footer from '../shared/components/footer';
|
|
6
|
+
import BaseHead from '../shared/components/base-head';
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
|
|
9
|
+
export default function Welcome({ name, userType }: WelcomeTemplateProps) {
|
|
10
|
+
const content: Record<USER_ROLES, { startLink: string; description: string }> = {
|
|
11
|
+
[USER_ROLES.BRAND]: {
|
|
12
|
+
startLink: appRoutes.creatorsList,
|
|
13
|
+
description:
|
|
14
|
+
' Obrigado por se registrar. Estamos muito felizes por tê-lo a bordo. Explore nossa plataforma e descubra os melhores influenciadores e criadores de conteúdo para suas necessidades de marketing.',
|
|
15
|
+
},
|
|
16
|
+
[USER_ROLES.CREATOR]: {
|
|
17
|
+
startLink: appRoutes.creatorPrivateProfile,
|
|
18
|
+
description:
|
|
19
|
+
' Obrigado por se registrar. Estamos muito felizes por tê-lo a bordo. Explore nossa plataforma e descubra as melhores marcas para colaborar.',
|
|
20
|
+
},
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
return (
|
|
24
|
+
<Html style={rootStyles}>
|
|
25
|
+
<BaseHead />
|
|
26
|
+
<Preview>Bem-vindo a Promote</Preview>
|
|
27
|
+
<Body style={{ ...main, ...baseContainer }}>
|
|
28
|
+
<Container style={headContainer}>
|
|
29
|
+
<Img src={`${assetsBasePath}/icons/logo-icon.png`} alt={'Promote Logo'} style={promoteLogo} />
|
|
30
|
+
<Img src={`${assetsBasePath}/icons/welcome-title.png`} alt={'Promote Logo'} style={welcomeImage} />
|
|
31
|
+
</Container>
|
|
32
|
+
|
|
33
|
+
<Container style={baseContentContainer}>
|
|
34
|
+
<Heading as={'h1'} style={title}>
|
|
35
|
+
Olá {name || '{{nome}}'} 🎉,
|
|
36
|
+
</Heading>
|
|
37
|
+
|
|
38
|
+
<Text style={textInfo}>{content[userType]?.description}</Text>
|
|
39
|
+
|
|
40
|
+
<Text style={textInfo}>
|
|
41
|
+
Em caso de qualquer dúvida, entre em conctato connosco através do e-mail:{' '}
|
|
42
|
+
<Link style={link} href="mailto:help@promote.co.mz">
|
|
43
|
+
help@promote.co.mz
|
|
44
|
+
</Link>{' '}
|
|
45
|
+
🚀
|
|
46
|
+
</Text>
|
|
47
|
+
</Container>
|
|
48
|
+
|
|
49
|
+
<Container style={baseContentContainer}>
|
|
50
|
+
{userType && (
|
|
51
|
+
<Link href={content[userType]?.startLink} style={{ ...button, width: '150px' }}>
|
|
52
|
+
COMEÇAR AGORA
|
|
53
|
+
</Link>
|
|
54
|
+
)}
|
|
55
|
+
</Container>
|
|
56
|
+
<Footer />
|
|
57
|
+
</Body>
|
|
58
|
+
</Html>
|
|
59
|
+
);
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
Welcome.PreviewProps = {
|
|
63
|
+
name: 'João antónio',
|
|
64
|
+
userType: USER_ROLES.BRAND,
|
|
65
|
+
} satisfies WelcomeTemplateProps;
|
|
66
|
+
|
|
67
|
+
const headContainer = {
|
|
68
|
+
...baseContentContainer,
|
|
69
|
+
marginBottom: '20px',
|
|
70
|
+
padding: '20px 0',
|
|
71
|
+
height: '200px',
|
|
72
|
+
backgroundColor: colors.primary,
|
|
73
|
+
borderRadius: '8px',
|
|
74
|
+
align: 'center',
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
const promoteLogo = {
|
|
78
|
+
width: '70px',
|
|
79
|
+
height: '70px',
|
|
80
|
+
margin: '0 auto',
|
|
81
|
+
marginBottom: '20px',
|
|
82
|
+
};
|
|
83
|
+
|
|
84
|
+
const welcomeImage = {
|
|
85
|
+
width: 'auto',
|
|
86
|
+
height: '30px',
|
|
87
|
+
margin: '0 auto',
|
|
88
|
+
};
|
|
89
|
+
|
|
90
|
+
const title = {
|
|
91
|
+
color: colors.primary,
|
|
92
|
+
fontSize: '22px',
|
|
93
|
+
fontWeight: 'bold',
|
|
94
|
+
marginTop: '10px',
|
|
95
|
+
marginBottom: '10px',
|
|
96
|
+
};
|
|
97
|
+
|
|
98
|
+
const textInfo = {
|
|
99
|
+
...baseText,
|
|
100
|
+
marginTop: '20px',
|
|
101
|
+
marginBottom: '20px',
|
|
102
|
+
};
|
|
103
|
+
|
|
104
|
+
export { Welcome };
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { Body, Container, Html, Link, Preview, Text } from '@react-email/components';
|
|
2
|
+
import { baseContainer, baseContentContainer, baseText, button, link, main, rootStyles } from '../shared/styles';
|
|
3
|
+
import Header from '../shared/components/header';
|
|
4
|
+
import Footer from '../shared/components/footer';
|
|
5
|
+
import BaseHead from '../shared/components/base-head';
|
|
6
|
+
import UserInfo from '../shared/components/user-Info';
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
import { appRoutes, assetsBasePath } from '../shared/values';
|
|
9
|
+
import { OrderEvidencesAcceptedBrandProps, USER_ROLES } from '../shared/types';
|
|
10
|
+
import PaymentAmount from '../shared/components/payment-amount';
|
|
11
|
+
|
|
12
|
+
export default function OrderEvidencesAcceptedBrand(props: OrderEvidencesAcceptedBrandProps) {
|
|
13
|
+
return (
|
|
14
|
+
<Html style={rootStyles}>
|
|
15
|
+
<BaseHead />
|
|
16
|
+
<Preview>Pagamento Efectuado com sucesso</Preview>
|
|
17
|
+
<Body style={{ ...main, ...baseContainer }}>
|
|
18
|
+
<Header />
|
|
19
|
+
|
|
20
|
+
<UserInfo photo={`${assetsBasePath}/icons/logo-icon-colored.png`} name={'Promote Team'} userType={USER_ROLES.BRAND} />
|
|
21
|
+
|
|
22
|
+
<Container style={{ ...baseContentContainer }}>
|
|
23
|
+
<Text style={baseText}>Olá, {props.brand.name} 🎊,</Text>
|
|
24
|
+
<Text style={baseText}>
|
|
25
|
+
O pagamento da{' '}
|
|
26
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} target={'_blank'} style={link}>
|
|
27
|
+
ordem #{props.order.id}
|
|
28
|
+
</Link>{' '}
|
|
29
|
+
foi efectuado com sucesso ✅.
|
|
30
|
+
<br />
|
|
31
|
+
Agradecemos por confiar na Promote, esperamos que a sua experiência tenha sido agradável.
|
|
32
|
+
</Text>
|
|
33
|
+
</Container>
|
|
34
|
+
|
|
35
|
+
<PaymentAmount totalAmount={props.totalAmount} />
|
|
36
|
+
|
|
37
|
+
<Container style={{ ...baseContentContainer, marginTop: '25px' }}>
|
|
38
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} style={{ ...button, width: '150px' }}>
|
|
39
|
+
VER PEDIDO
|
|
40
|
+
</Link>
|
|
41
|
+
</Container>
|
|
42
|
+
|
|
43
|
+
<Footer />
|
|
44
|
+
</Body>
|
|
45
|
+
</Html>
|
|
46
|
+
);
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
OrderEvidencesAcceptedBrand.PreviewProps = {
|
|
50
|
+
order: {
|
|
51
|
+
id: '123',
|
|
52
|
+
},
|
|
53
|
+
brand: {
|
|
54
|
+
name: 'Vodacom Mz',
|
|
55
|
+
},
|
|
56
|
+
totalAmount: '1000,00',
|
|
57
|
+
} satisfies OrderEvidencesAcceptedBrandProps;
|
|
58
|
+
|
|
59
|
+
export { OrderEvidencesAcceptedBrand };
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { Body, Container, Html, Link, Preview, Text } from '@react-email/components';
|
|
2
|
+
import { baseContainer, baseContentContainer, baseText, button, link, main, rootStyles } from '../shared/styles';
|
|
3
|
+
import Header from '../shared/components/header';
|
|
4
|
+
import Footer from '../shared/components/footer';
|
|
5
|
+
import BaseHead from '../shared/components/base-head';
|
|
6
|
+
import UserInfo from '../shared/components/user-Info';
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
import { appRoutes } from '../shared/values';
|
|
9
|
+
import { EvidenceSubmittedBrandProps, USER_ROLES } from '../shared/types';
|
|
10
|
+
|
|
11
|
+
export default function EvidencesSubmittedBrand(props: EvidenceSubmittedBrandProps) {
|
|
12
|
+
return (
|
|
13
|
+
<Html style={rootStyles}>
|
|
14
|
+
<BaseHead />
|
|
15
|
+
<Preview>Evidências submetidas 🆕</Preview>
|
|
16
|
+
<Body style={{ ...main, ...baseContainer }}>
|
|
17
|
+
<Header />
|
|
18
|
+
|
|
19
|
+
<UserInfo photo={props.creator.photo} name={props.creator.name} userType={USER_ROLES.CREATOR} username={props.creator.username} />
|
|
20
|
+
|
|
21
|
+
<Container style={{ ...baseContentContainer }}>
|
|
22
|
+
<Text style={baseText}>Olá, {props.brand.name},</Text>
|
|
23
|
+
<Text style={baseText}>
|
|
24
|
+
O criador de conteúdos{' '}
|
|
25
|
+
<Link href={appRoutes.creatorPublicProfile(props.creator.username)} target={'_blank'} style={link}>
|
|
26
|
+
{props.creator.name}
|
|
27
|
+
</Link>{' '}
|
|
28
|
+
submeteu novas evidências para o seu{' '}
|
|
29
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} target={'_blank'} style={link}>
|
|
30
|
+
pedido. 🚀
|
|
31
|
+
</Link>{' '}
|
|
32
|
+
<br /> Por favor, verifique as evidências submetidas e <b>aprove ✅</b> ou <b>rejeite ❌</b> o trabalho.
|
|
33
|
+
</Text>
|
|
34
|
+
</Container>
|
|
35
|
+
|
|
36
|
+
<Container style={{ ...baseContentContainer }}>
|
|
37
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} style={{ ...button, width: '150px' }}>
|
|
38
|
+
VER EVIDÊNCIAS
|
|
39
|
+
</Link>
|
|
40
|
+
</Container>
|
|
41
|
+
|
|
42
|
+
<Footer />
|
|
43
|
+
</Body>
|
|
44
|
+
</Html>
|
|
45
|
+
);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
EvidencesSubmittedBrand.PreviewProps = {
|
|
49
|
+
package: {
|
|
50
|
+
name: '1 Instagram Post',
|
|
51
|
+
},
|
|
52
|
+
order: {
|
|
53
|
+
id: '123',
|
|
54
|
+
},
|
|
55
|
+
brand: {
|
|
56
|
+
name: 'Vodacom Mz',
|
|
57
|
+
},
|
|
58
|
+
creator: {
|
|
59
|
+
username: 'test_user',
|
|
60
|
+
name: 'Kátia Vanessa',
|
|
61
|
+
photo: 'https://s3.us-east-2.amazonaws.com/promote-mz.com/images/8c52bb92-4a8b-472f-89cb-0428b90b8b74.jpg',
|
|
62
|
+
},
|
|
63
|
+
} satisfies EvidenceSubmittedBrandProps;
|
|
64
|
+
|
|
65
|
+
export { EvidencesSubmittedBrand };
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
import { Body, Container, Html, Link, Preview, Text } from '@react-email/components';
|
|
2
|
+
import { baseContainer, baseContentContainer, baseText, button, link, main, rootStyles } from '../shared/styles';
|
|
3
|
+
import Header from '../shared/components/header';
|
|
4
|
+
import Footer from '../shared/components/footer';
|
|
5
|
+
import BaseHead from '../shared/components/base-head';
|
|
6
|
+
import UserInfo from '../shared/components/user-Info';
|
|
7
|
+
import NewOrderInfo from '../shared/components/new-order-info';
|
|
8
|
+
import * as React from 'react';
|
|
9
|
+
import { appRoutes } from '../shared/values';
|
|
10
|
+
import { NewOrderCreatedBrandProps, USER_ROLES } from '../shared/types';
|
|
11
|
+
|
|
12
|
+
export default function NewOrderCreatedBrand(props: NewOrderCreatedBrandProps) {
|
|
13
|
+
return (
|
|
14
|
+
<Html style={rootStyles}>
|
|
15
|
+
<BaseHead />
|
|
16
|
+
<Preview>Novo Pedido efectuado</Preview>
|
|
17
|
+
<Body style={{ ...main, ...baseContainer }}>
|
|
18
|
+
<Header />
|
|
19
|
+
|
|
20
|
+
<UserInfo photo={props.creator.photo} name={props.creator.name} userType={USER_ROLES.CREATOR} username={props.creator.username} />
|
|
21
|
+
|
|
22
|
+
<Container style={{ ...baseContentContainer }}>
|
|
23
|
+
<Text style={baseText}>Olá, {props.brand.name},</Text>
|
|
24
|
+
<Text style={baseText}>
|
|
25
|
+
Parabéns 🎉, efectuou com sucesso a criação de uma ordem para o criador de conteúdos{' '}
|
|
26
|
+
<Link href={appRoutes.creatorPublicProfile(props.creator.username)} style={link}>
|
|
27
|
+
{props.creator.name}.
|
|
28
|
+
</Link>
|
|
29
|
+
<br /> Por favor, revise os detalhes abaixo 🚀:
|
|
30
|
+
</Text>
|
|
31
|
+
</Container>
|
|
32
|
+
|
|
33
|
+
<Container style={orderDetails}>
|
|
34
|
+
<NewOrderInfo orderCreatedAt={props.order.createdAt} packageName={props.package.name} packagePrice={props.package.price} />
|
|
35
|
+
</Container>
|
|
36
|
+
|
|
37
|
+
<Container style={{ ...baseContentContainer }}>
|
|
38
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} style={{ ...button, width: '120px' }}>
|
|
39
|
+
VER PEDIDO
|
|
40
|
+
</Link>
|
|
41
|
+
</Container>
|
|
42
|
+
|
|
43
|
+
<Footer />
|
|
44
|
+
</Body>
|
|
45
|
+
</Html>
|
|
46
|
+
);
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
NewOrderCreatedBrand.PreviewProps = {
|
|
50
|
+
package: {
|
|
51
|
+
name: '1 Instagram Post',
|
|
52
|
+
price: '1000.00',
|
|
53
|
+
},
|
|
54
|
+
order: {
|
|
55
|
+
id: '123',
|
|
56
|
+
createdAt: '20 de Agosto, 2021',
|
|
57
|
+
},
|
|
58
|
+
brand: {
|
|
59
|
+
name: 'Vodacom Mz',
|
|
60
|
+
},
|
|
61
|
+
creator: {
|
|
62
|
+
username: 'test_user',
|
|
63
|
+
name: 'Kátia Vanessa',
|
|
64
|
+
photo: 'https://s3.us-east-2.amazonaws.com/promote-mz.com/images/8c52bb92-4a8b-472f-89cb-0428b90b8b74.jpg',
|
|
65
|
+
},
|
|
66
|
+
} satisfies NewOrderCreatedBrandProps;
|
|
67
|
+
|
|
68
|
+
const orderDetails = {
|
|
69
|
+
...baseContentContainer,
|
|
70
|
+
marginTop: '30px',
|
|
71
|
+
marginBottom: '40px',
|
|
72
|
+
};
|
|
73
|
+
|
|
74
|
+
export { NewOrderCreatedBrand };
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { Body, Container, Html, Link, Preview, Text } from '@react-email/components';
|
|
2
|
+
import { baseContainer, baseContentContainer, baseText, button, link, main, rootStyles } from '../shared/styles';
|
|
3
|
+
import Header from '../shared/components/header';
|
|
4
|
+
import Footer from '../shared/components/footer';
|
|
5
|
+
import BaseHead from '../shared/components/base-head';
|
|
6
|
+
import UserInfo from '../shared/components/user-Info';
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
import { appRoutes } from '../shared/values';
|
|
9
|
+
import { OrderAcceptedBrandProps, USER_ROLES } from '../shared/types';
|
|
10
|
+
|
|
11
|
+
export default function OrderAcceptedBrand(props: OrderAcceptedBrandProps) {
|
|
12
|
+
return (
|
|
13
|
+
<Html style={rootStyles}>
|
|
14
|
+
<BaseHead />
|
|
15
|
+
<Preview>Pedido aceite ✅</Preview>
|
|
16
|
+
<Body style={{ ...main, ...baseContainer }}>
|
|
17
|
+
<Header />
|
|
18
|
+
|
|
19
|
+
<UserInfo photo={props.creator.photo} name={props.creator.name} userType={USER_ROLES.CREATOR} username={props.creator.username} />
|
|
20
|
+
|
|
21
|
+
<Container style={{ ...baseContentContainer }}>
|
|
22
|
+
<Text style={baseText}>Olá, {props.brand.name},</Text>
|
|
23
|
+
<Text style={baseText}>
|
|
24
|
+
O seu{' '}
|
|
25
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} target={'_blank'} style={link}>
|
|
26
|
+
pedido
|
|
27
|
+
</Link>{' '}
|
|
28
|
+
foi aceite ✅ por{' '}
|
|
29
|
+
<Link href={appRoutes.creatorPublicProfile(props.creator.username)} style={link}>
|
|
30
|
+
{props.creator.name}.
|
|
31
|
+
</Link>
|
|
32
|
+
<br /> Agora é só aguardar que o trabalho seja executado.
|
|
33
|
+
<br /> Assim que o trabalho for concluído, você receberá um email com os detalhes 🚀.
|
|
34
|
+
</Text>
|
|
35
|
+
</Container>
|
|
36
|
+
|
|
37
|
+
<Container style={{ ...baseContentContainer }}>
|
|
38
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} style={{ ...button, width: '120px' }}>
|
|
39
|
+
VER PEDIDO!
|
|
40
|
+
</Link>
|
|
41
|
+
</Container>
|
|
42
|
+
|
|
43
|
+
<Footer />
|
|
44
|
+
</Body>
|
|
45
|
+
</Html>
|
|
46
|
+
);
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
OrderAcceptedBrand.PreviewProps = {
|
|
50
|
+
order: {
|
|
51
|
+
id: '123',
|
|
52
|
+
},
|
|
53
|
+
brand: {
|
|
54
|
+
name: 'Vodacom Mz',
|
|
55
|
+
},
|
|
56
|
+
creator: {
|
|
57
|
+
username: 'test_user',
|
|
58
|
+
name: 'Kátia Vanessa',
|
|
59
|
+
photo: 'https://s3.us-east-2.amazonaws.com/promote-mz.com/images/8c52bb92-4a8b-472f-89cb-0428b90b8b74.jpg',
|
|
60
|
+
},
|
|
61
|
+
} satisfies OrderAcceptedBrandProps;
|
|
62
|
+
|
|
63
|
+
export { OrderAcceptedBrand };
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
import { Body, Container, Html, Link, Preview, Text } from '@react-email/components';
|
|
2
|
+
import { baseContainer, baseContentContainer, baseText, button, link, main, rootStyles } from '../shared/styles';
|
|
3
|
+
import Header from '../shared/components/header';
|
|
4
|
+
import Footer from '../shared/components/footer';
|
|
5
|
+
import BaseHead from '../shared/components/base-head';
|
|
6
|
+
import UserInfo from '../shared/components/user-Info';
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
import { appRoutes, assetsBasePath } from '../shared/values';
|
|
9
|
+
import { OrderCancelledBrandProps, USER_ROLES } from '../shared/types';
|
|
10
|
+
import CommentComponent from '../shared/components/comment-component';
|
|
11
|
+
|
|
12
|
+
export default function OrderCancelledBrand(props: OrderCancelledBrandProps) {
|
|
13
|
+
return (
|
|
14
|
+
<Html style={rootStyles}>
|
|
15
|
+
<BaseHead />
|
|
16
|
+
<Preview>Pedido cancelado ❌</Preview>
|
|
17
|
+
<Body style={{ ...main, ...baseContainer }}>
|
|
18
|
+
<Header />
|
|
19
|
+
|
|
20
|
+
<UserInfo photo={`${assetsBasePath}/icons/logo-icon-colored.png`} name={'Promote Team'} userType={USER_ROLES.BRAND} />
|
|
21
|
+
|
|
22
|
+
<Container style={{ ...baseContentContainer }}>
|
|
23
|
+
<Text style={baseText}>Olá, {props.brand.name},</Text>
|
|
24
|
+
<Text style={baseText}>
|
|
25
|
+
O{' '}
|
|
26
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} target={'_blank'} style={link}>
|
|
27
|
+
pedido #{props.order.id}
|
|
28
|
+
</Link>{' '}
|
|
29
|
+
foi cancelado ❌ antes da sua conclusão.
|
|
30
|
+
<br />O seu pagamento será reembolsado dentro de 24h.
|
|
31
|
+
</Text>
|
|
32
|
+
</Container>
|
|
33
|
+
|
|
34
|
+
{props.reason && (
|
|
35
|
+
<div style={reasonContainer}>
|
|
36
|
+
<CommentComponent title={'Motivo do cancelamento:'} comment={props.reason} danger />
|
|
37
|
+
</div>
|
|
38
|
+
)}
|
|
39
|
+
|
|
40
|
+
<Container style={{ ...baseContentContainer }}>
|
|
41
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} style={{ ...button, width: '120px' }}>
|
|
42
|
+
VER PEDIDO!
|
|
43
|
+
</Link>
|
|
44
|
+
</Container>
|
|
45
|
+
|
|
46
|
+
<Footer />
|
|
47
|
+
</Body>
|
|
48
|
+
</Html>
|
|
49
|
+
);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
OrderCancelledBrand.PreviewProps = {
|
|
53
|
+
order: {
|
|
54
|
+
id: '123',
|
|
55
|
+
},
|
|
56
|
+
brand: {
|
|
57
|
+
name: 'Vodacom Mz',
|
|
58
|
+
},
|
|
59
|
+
reason: 'O influencer não aceitou o pedido.',
|
|
60
|
+
} satisfies OrderCancelledBrandProps;
|
|
61
|
+
|
|
62
|
+
const reasonContainer = {
|
|
63
|
+
width: '100%',
|
|
64
|
+
padding: '0',
|
|
65
|
+
margin: '30px 0',
|
|
66
|
+
};
|
|
67
|
+
|
|
68
|
+
export { OrderCancelledBrand };
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import { Body, Container, Html, Link, Preview, Text } from '@react-email/components';
|
|
2
|
+
import { baseContainer, baseContentContainer, baseText, button, link, main, rootStyles } from '../shared/styles';
|
|
3
|
+
import Header from '../shared/components/header';
|
|
4
|
+
import Footer from '../shared/components/footer';
|
|
5
|
+
import BaseHead from '../shared/components/base-head';
|
|
6
|
+
import UserInfo from '../shared/components/user-Info';
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
import { appRoutes } from '../shared/values';
|
|
9
|
+
import { OrderRejectedBrandProps, USER_ROLES } from '../shared/types';
|
|
10
|
+
import CommentComponent from '../shared/components/comment-component';
|
|
11
|
+
|
|
12
|
+
export default function OrderRejectedBrand(props: OrderRejectedBrandProps) {
|
|
13
|
+
return (
|
|
14
|
+
<Html style={rootStyles}>
|
|
15
|
+
<BaseHead />
|
|
16
|
+
<Preview>Pedido Rejeitado ❌</Preview>
|
|
17
|
+
<Body style={{ ...main, ...baseContainer }}>
|
|
18
|
+
<Header />
|
|
19
|
+
|
|
20
|
+
<UserInfo photo={props.creator.photo} name={props.creator.name} userType={USER_ROLES.CREATOR} username={props.creator.username} />
|
|
21
|
+
|
|
22
|
+
<Container style={{ ...baseContentContainer }}>
|
|
23
|
+
<Text style={baseText}>Olá, {props.brand.name},</Text>
|
|
24
|
+
<Text style={baseText}>
|
|
25
|
+
O seu{' '}
|
|
26
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} target={'_blank'} style={link}>
|
|
27
|
+
pedido
|
|
28
|
+
</Link>{' '}
|
|
29
|
+
foi rejeitado ❌ pelo criador de conteúdo{' '}
|
|
30
|
+
<Link href={appRoutes.creatorPublicProfile(props.creator.username)} style={link}>
|
|
31
|
+
{props.creator.name}.
|
|
32
|
+
</Link>
|
|
33
|
+
<br />O seu pagamento será reembolsado dentro de 24 horas.
|
|
34
|
+
</Text>
|
|
35
|
+
</Container>
|
|
36
|
+
|
|
37
|
+
{props.reason && (
|
|
38
|
+
<div style={reasonContainer}>
|
|
39
|
+
<CommentComponent title={'Motivo da Rejeição'} comment={props.reason} />
|
|
40
|
+
</div>
|
|
41
|
+
)}
|
|
42
|
+
|
|
43
|
+
<Container style={{ ...baseContentContainer }}>
|
|
44
|
+
<Link href={appRoutes.brandOrderDetails(props.order.id)} style={{ ...button, width: '120px' }}>
|
|
45
|
+
VER PEDIDO
|
|
46
|
+
</Link>
|
|
47
|
+
</Container>
|
|
48
|
+
|
|
49
|
+
<Footer />
|
|
50
|
+
</Body>
|
|
51
|
+
</Html>
|
|
52
|
+
);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
OrderRejectedBrand.PreviewProps = {
|
|
56
|
+
package: {
|
|
57
|
+
name: '1 Instagram Post',
|
|
58
|
+
},
|
|
59
|
+
order: {
|
|
60
|
+
id: '123',
|
|
61
|
+
},
|
|
62
|
+
brand: {
|
|
63
|
+
name: 'Vodacom Mz',
|
|
64
|
+
},
|
|
65
|
+
creator: {
|
|
66
|
+
username: 'test_user',
|
|
67
|
+
name: 'Kátia Vanessa',
|
|
68
|
+
photo: 'https://s3.us-east-2.amazonaws.com/promote-mz.com/images/8c52bb92-4a8b-472f-89cb-0428b90b8b74.jpg',
|
|
69
|
+
},
|
|
70
|
+
reason: 'Não me identifiquei com a marca e o produto.',
|
|
71
|
+
} satisfies OrderRejectedBrandProps;
|
|
72
|
+
|
|
73
|
+
const reasonContainer = {
|
|
74
|
+
width: '100%',
|
|
75
|
+
padding: '0',
|
|
76
|
+
margin: '30px 0',
|
|
77
|
+
};
|
|
78
|
+
|
|
79
|
+
export { OrderRejectedBrand };
|