Skip to content

Commit bf06bee

Browse files
OmkarPhOmkarPh
committed
Merge branch 'master' into setup
2 parents 3b3adc6 + b739ec0 commit bf06bee

File tree

1 file changed

+155
-5
lines changed

1 file changed

+155
-5
lines changed

‎src/pages/recentVerifications.jsx‎

Lines changed: 155 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,161 @@
1-
import React from 'react'
1+
import React from "react";
22

33
const RecentVerifications = () => {
4+
const [showModal, setShowModal] = React.useState(false);
5+
6+
const people = [
7+
{
8+
name: "Vansh",
9+
birth: "23-1-2023",
10+
Gender: "Male",
11+
Email: "vansh@gmail.com",
12+
Aadhar: 3310,
13+
// Message will come with reports.message for red Verifiedtruegreen, it will be from recommends.
14+
Verified: "true",
15+
},
16+
{
17+
name: "Abhi",
18+
birth: "23-9-2023",
19+
Gender: "Male",
20+
Email: "vansh@gmail.com",
21+
Aadhar: 3310,
22+
Verified: "false",
23+
},
24+
{
25+
name: "Bunty",
26+
birth: "23-2-2023",
27+
Gender: "Male",
28+
Email: "vansh@gmail.com",
29+
Aadhar: 3310,
30+
Verified: "true",
31+
},
32+
{
33+
name: "Cinderela",
34+
birth: "23-7-2023",
35+
Gender: "Male",
36+
Email: "vansh@gmail.com",
37+
Aadhar: 3310,
38+
Verified: "false",
39+
},
40+
{
41+
name: "Zen",
42+
birth: "23-3-2023",
43+
Gender: "Male",
44+
Email: "vansh@gmail.com",
45+
Aadhar: 3310,
46+
Verified: "true",
47+
},
48+
];
49+
50+
console.log(showModal);
51+
452
return (
553
<div>
6-
Recent Verifications
54+
<div className="relative overflow-x-auto">
55+
<table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
56+
<thead className="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
57+
<tr>
58+
<th scope="col" className="px-6 py-3">
59+
Birth Date
60+
</th>
61+
<th scope="col" className="px-6 py-3">
62+
Name
63+
</th>
64+
<th scope="col" className="px-6 py-3">
65+
Gender
66+
</th>
67+
<th scope="col" className="px-6 py-3">
68+
Email
69+
</th>
70+
<th scope="col" className="px-6 py-3">
71+
Aadhar
72+
</th>
73+
<th scope="col" className="px-6 py-3">
74+
Verified
75+
</th>
76+
<th scope="col" className="px-6 py-3">
77+
{/* Add Verified */}
78+
</th>
79+
</tr>
80+
</thead>
81+
<tbody>
82+
{people.map((data) => {
83+
return (
84+
<tr className="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
85+
<td className="px-6 py-4">{data.birth}</td>
86+
<td className="px-6 py-4">{data.name}</td>
87+
<td className="px-6 py-4">{data.Gender}</td>
88+
<td className="px-6 py-4">{data.Email}</td>
89+
<td className="px-6 py-4">{data.Aadhar}</td>
90+
<td className="px-6 py-4">{data.Verified}</td>
91+
<button
92+
disabled={data.Verified === "true" ? false : true}
93+
onClick={() => setShowModal(true)}
94+
className="mt-2 text-white bg-black hover:bg-gray-900 focus:outline-none focus:ring-4 focus:ring-gray-300 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 dark:bg-gray-800 dark:hover:bg-gray-700 dark:focus:ring-gray-700 dark:border-gray-700"
95+
>
96+
Add+
97+
</button>
98+
{showModal === true && (
99+
<>
100+
<div className="fixed top-0 left-0 right-0 z-50 w-full p-4 md:inset-0 h-[calc(100%-1rem)] md:h-full">
101+
<div className="relative w-full h-full max-w-2xl md:h-auto">
102+
<div className="relative bg-white rounded-lg shadow dark:bg-gray-700">
103+
<div className="flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600">
104+
<h3 className="text-xl font-semibold text-gray-900 dark:text-white">
105+
Note this message
106+
</h3>
107+
<button
108+
className="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 ml-auto inline-flex items-center dark:hover:bg-gray-600 dark:hover:text-white"
109+
onClick={() => {
110+
setShowModal(false);
111+
}}
112+
>
113+
<svg
114+
aria-hidden="true"
115+
className="w-5 h-5"
116+
fill="currentColor"
117+
viewBox="0 0 20 20"
118+
xmlns="http://www.w3.org/2000/svg"
119+
>
120+
<path
121+
fill-rule="evenodd"
122+
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
123+
clip-rule="evenodd"
124+
></path>
125+
</svg>
126+
</button>
127+
</div>
128+
<div className="p-6 space-y-6">
129+
<p className="text-base leading-relaxed text-gray-500 dark:text-gray-400">
130+
With less than a month to go before the European
131+
Union enacts new consumer privacy laws for its
132+
citizens, companies around the world are
133+
updating their terms of service agreements to
134+
comply.
135+
</p>
136+
<p className="text-base leading-relaxed text-gray-500 dark:text-gray-400">
137+
The European Union’s General Data Protection
138+
Regulation (G.D.P.R.) goes into effect on May 25
139+
and is meant to ensure a common set of data
140+
rights in the European Union. It requires
141+
organizations to notify users as soon as
142+
possible of high-risk data breaches that could
143+
personally affect them.
144+
</p>
145+
</div>
146+
</div>
147+
</div>
148+
</div>
149+
</>
150+
)}
151+
</tr>
152+
);
153+
})}
154+
</tbody>
155+
</table>
156+
</div>
7157
</div>
8-
)
9-
}
158+
);
159+
};
10160

11-
export default RecentVerifications
161+
export default RecentVerifications;

0 commit comments

Comments
 (0)