-
Notifications
You must be signed in to change notification settings - Fork 6
/
PricingModal.tsx
102 lines (97 loc) · 4.21 KB
/
PricingModal.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
import { useState } from 'react';
import { Text, Modal, Button, ModalBody, ModalFooter, ModalOverlay, ModalContent, SimpleGrid, Box } from '@chakra-ui/react';
// import { MdDiamond } from "react-icons/md";
export default function PricingModal() {
const [show, setShow] = useState(false);
const handleClose = () => setShow(false);
const handleShow = () => setShow(true);
return (
<>
<Button onClick={handleShow}>
Pricing
</Button>
<Modal isOpen={show} onClose={handleClose} size="5xl">
<ModalOverlay />
<ModalContent p={8} backgroundColor="#0d1117" pb={4}>
<ModalBody>
<SimpleGrid columns={{ base: 1, md: 3 }} spacing={10}>
<Box
display="flex"
flexDirection="column"
alignItems="center"
justifyContent="space-between"
height="100%"
>
<Box>
<Text fontSize="lg" mb={2} textAlign="center">
⚡ Basic
</Text>
<Text fontSize="4xl" mb="4" fontWeight="bold" textAlign="center">
Free
</Text>
<Box as="ul" style={{ listStyleType: 'none' }}>
<li>✔ 5 GPT-4 Sweep tickets / month</li>
<li>✔ Unlimited GPT-3.5 Sweep issues</li>
<br />
<li>
<Button colorScheme="purple" onClick={() => window.open("https://buy.stripe.com/7sI4jlaCR3PaabebIP", "_blank")}>
Extended trial
</Button>
- make a <b>one-time purchase</b> of 15 additional PRs
</li>
</Box>
</Box>
<Button colorScheme="purple" mt={12} onClick={() => window.open("https://github.com/sweepai/sweep#-getting-started", "_blank")}>
Install
</Button>
</Box>
<Box display="flex" flexDirection="column" alignItems="center" justifyContent="space-between" height="100%">
<Box>
<Text fontSize="lg" mb={2} textAlign="center">
💎 Pro
</Text>
<Text fontSize="4xl" mb="4" fontWeight="bold" textAlign="center">
$480 <span style={{ fontWeight: "normal" }}>/ month</span>
</Text>
<Box as="ul" style={{ listStyleType: 'none' }}>
<li>✔ Unlimited GPT-4 Sweep issues</li>
<li>✔ Faster search with live re-indexing</li>
<li>✔ Priority support</li>
<li>✔ Commercial SLA</li>
</Box>
</Box>
<Button colorScheme="purple" mt={12} onClick={() => window.open("https://buy.stripe.com/6oE5npbGVbhC97afZ4", "_blank")}>
Purchase
</Button>
</Box>
<Box display="flex" flexDirection="column" alignItems="center" justifyContent="space-between" height="100%">
<Box>
<Text fontSize="lg" mb={2} textAlign="center">
🏢 Enterprise
</Text>
<Text fontSize="4xl" mb="4" fontWeight="bold" textAlign="center">
Custom
</Text>
<Box as="ul" style={{ listStyleType: 'none' }}>
<li>✔ Unlimited GPT-4 Sweep issues</li>
<li>✔ Fine-tuned retrieval model</li>
<li>✔ Self-hosted backend</li>
<li>✔ Enterprise support</li>
</Box>
</Box>
<Button colorScheme="purple" mt={12} onClick={() => window.open("https://form.typeform.com/to/wliuvyWE", "_blank")}>
Contact us
</Button>
</Box>
</SimpleGrid>
</ModalBody>
<ModalFooter display="flex" alignItems="center" flexDirection="column">
<Button variant="ghost" onClick={handleClose} mt={4}>
✕
</Button>
</ModalFooter>
</ ModalContent>
</Modal >
</>
);
}