Skip to content

Commit 7d911aa

Browse files
AdnanarodiyaAdnanarodiya
committed
feat: Update Xata client schema and enhance repository card and report modal styles for improved user experience
1 parent 0cb22cf commit 7d911aa

File tree

5 files changed

+197
-52
lines changed

5 files changed

+197
-52
lines changed

‎src/app/(public)/repos/[language]/_components/repo-card.tsx‎

Lines changed: 21 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -35,30 +35,32 @@ export function RepoCard({ repo }: RepoCardProps) {
3535
<section className="transition duration-300 shadow-sm card bg-hacktoberfest-blue ring-1 ring-hacktoberfest-light hover:scale-105 hover:shadow-2xl hover:shadow-hacktoberfest-light-blue h-125">
3636
<div className="relative p-6 card-body">
3737
<div className="flex-1">
38-
<div className="flex items-center gap-2">
39-
<a
40-
className="border-2 rounded-full h-14 aspect-square p-1.5 border-hacktoberfest-beige"
41-
href={repo.owner.html_url}
42-
title={repo.owner.login}
43-
target="_blank"
44-
rel="noreferrer"
45-
>
46-
<img
47-
src={repo.owner.avatar_url}
48-
alt={repo.owner.login}
49-
className="rounded-full"
50-
/>
51-
</a>
52-
<h2 className="overflow-hidden text-3xl cursor-pointer text-hacktoberfest-light whitespace-nowrap text-ellipsis underline-expand">
38+
<div className="flex items-center gap-2 justify-between">
39+
<div className="flex items-center gap-2">
5340
<a
54-
href={repo.html_url + '?ref=finder.usmans.me'}
55-
title={repo.name}
41+
className="border-2 rounded-full h-14 aspect-square p-1.5 border-hacktoberfest-beige"
42+
href={repo.owner.html_url}
43+
title={repo.owner.login}
5644
target="_blank"
5745
rel="noreferrer"
5846
>
59-
{repo.name}
47+
<img
48+
src={repo.owner.avatar_url}
49+
alt={repo.owner.login}
50+
className="rounded-full"
51+
/>
6052
</a>
61-
</h2>
53+
<h2 className="overflow-hidden text-3xl cursor-pointer text-hacktoberfest-light line-clamp-1">
54+
<a
55+
href={repo.html_url + '?ref=finder.usmans.me'}
56+
title={repo.name}
57+
target="_blank"
58+
rel="noreferrer"
59+
>
60+
{repo.name}
61+
</a>
62+
</h2>
63+
</div>
6264
<ReportButton repo={repo} />
6365
</div>
6466

‎src/app/(public)/repos/[language]/_components/report-button.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,18 +14,17 @@ export function ReportButton({ repo }: ReportButtonProps) {
1414

1515
return (
1616
<button
17-
className="inline-flex items-center p-2 text-center transition duration-200 ease-linear rounded-lg hover:bg-hacktoberfest-light-pink hover:*:text-hacktoberfest-deep-pink stat-title"
17+
className=" inline-flex items-center p-2 text-center transition duration-200 ease-linear rounded-lg hover:bg-hacktoberfest-light-blue stat-title"
1818
onClick={() => {
1919
const modal = document.getElementById('modal') as HTMLDialogElement;
20-
console.log(modal);
2120

2221
if (modal) {
2322
setRepo(repo);
2423
modal.showModal();
2524
}
2625
}}
2726
>
28-
<GoAlertFill className="text-lg border-none outline-none text-hacktoberfest-light" />
27+
<GoAlertFill className="text-lg border-none outline-none text-hacktoberfest-light hover:text-yellow-400" />
2928
</button>
3029
);
3130
}

‎src/app/(public)/repos/[language]/_components/stars-filter.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ export function StarsFilter() {
5353

5454
return (
5555
<form
56-
className="w-full px-2 m-2 mx-auto mb-4 lg:w-2/4 form-control"
56+
className="w-full px-2 m-2 mx-auto mb-4 sm:w-3/4 xl:w-2/4 form-control"
5757
onSubmit={handleSubmit(onSubmit)}
5858
>
5959
<div className="flex flex-col gap-2 sm:flex-row">
@@ -62,7 +62,7 @@ export function StarsFilter() {
6262
render={({ field }) => (
6363
<input
6464
type="number"
65-
className="w-3/5 pr-4 m-auto text-center bg-transparent sm:w-full input input-bordered md:text-left text-hacktoberfest-light placeholder:text-hacktoberfest-beige border-hacktoberfest-light focus:border-hacktoberfest-light-blue focus:outline-none transition-colors duration-200"
65+
className="w-3/5 pr-4 m-auto text-center bg-transparent sm:w-full input input-bordered md:text-left text-hacktoberfest-light placeholder:text-hacktoberfest-beige border-hacktoberfest-light focus:border-hacktoberfest-light-blue focus:outline-none transition-colors duration-200 placeholder:line-clamp-1"
6666
{...field}
6767
onChange={e => field.onChange(e.target.valueAsNumber)}
6868
placeholder="Star's Starting Range"

‎src/components/report-modal.tsx‎

Lines changed: 43 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import { repoAtom } from '@/state/repoAtom';
1212
import { SendReportSchema } from '@/app/validation';
1313
import { sendReportAction } from '@/app/actions';
1414
import { cn } from '@/lib/utils';
15+
import { Button } from '@/app/(public)/_components/button';
1516

1617
export function ReportModal() {
1718
const isReported = useGetRepo();
@@ -59,65 +60,85 @@ export function ReportModal() {
5960

6061
return (
6162
<dialog id="modal" className="modal modal-bottom sm:modal-middle">
62-
<div className="w-full max-w-2xl modal-box bg-hacktoberfest-black border-hacktoberfest-light-green border md:w-11/12">
63-
<h3 className="block mb-2 text-2xl font-medium text-center text-hacktoberfest-light-green">
63+
<div
64+
className="w-full max-w-2xl modal-box bg-hacktoberfest-blue shadow-2xl md:w-11/12 rounded-xl border border-hacktoberfest-light-blue"
65+
style={{ boxShadow: '0 25px 50px -12px rgba(208, 204, 227, 0.25)' }}
66+
>
67+
<h3 className="block text-3xl font-bold text-hacktoberfest-light">
6468
Report This Repository
6569
</h3>
6670
{session.data ? (
6771
!isReported ? (
6872
<div className="flex flex-col modal-action">
69-
<p className="text-lg text-hacktoberfest-light">
73+
<p className="text-lg text-hacktoberfest-light mb-4">
7074
Please provide as much detail as possible to explain why you are
7175
reporting this repository.
72-
<span className="flex items-center gap-2 mt-2 text-sm font-bold text-hacktoberfest-green">
73-
<GoStop />
76+
<span className="flex items-center gap-2 mt-3 text-sm font-bold text-hacktoberfest-light bg-hacktoberfest-light-blue/20 p-3 rounded-lg">
77+
<GoStop className="text-red-400" />
7478
Note that we may remove the repository
7579
</span>
7680
</p>
7781

78-
<form method="dialog" onSubmit={handleSubmit}>
82+
<form method="dialog" onSubmit={handleSubmit} className="w-full">
7983
<textarea
8084
name="message"
8185
placeholder="Why do you want to report this repository..."
82-
className="w-full p-2 mt-6 -ml-2 text-white rounded-md textarea-lg textarea textarea-bordered textarea-ghost focus:outline-hacktoberfest-pink"
86+
className="w-full p-4 mt-4 text-white rounded-lg textarea-lg textarea textarea-bordered bg-hacktoberfest-light-blue/10 focus:outline-none focus:ring-2 focus:ring-hacktoberfest-light/50 transition-all duration-200"
8387
required
88+
rows={4}
8489
/>
85-
<div className="flex items-center justify-end p-2 mt-4 ml-6 space-x-4">
90+
<div className="flex items-center justify-end p-2 mt-6 space-x-4">
8691
<button
92+
type="button"
93+
onClick={handleCloseClick}
94+
className="btn bg-transparent text-hacktoberfest-light hover:bg-hacktoberfest-light hover:text-hacktoberfest-blue transition-all duration-200"
95+
style={{
96+
boxShadow: '0 10px 15px -3px rgba(208, 204, 227, 0.1)'
97+
}}
98+
>
99+
Cancel
100+
</button>
101+
<Button
87102
type="submit"
88103
className={cn(
89-
'btn glass shadow-md bg-hacktoberfest-deep-pink text-xl text-hacktoberfest-light hover:bg-hacktoberfest-pink',
90104
isLoading &&
91-
'disabled cursor-not-allowed pointer-events-none'
105+
'disabled cursor-not-allowed pointer-events-none opacity-50'
92106
)}
93107
>
94-
{isLoading ? <span>Loading...</span> : <span>Submit</span>}
95-
</button>
108+
{isLoading ? (
109+
<span className="flex items-center gap-2">
110+
<div className="w-4 h-4 border-2 border-current border-t-transparent rounded-full animate-spin"></div>
111+
Loading...
112+
</span>
113+
) : (
114+
<span>Submit Report</span>
115+
)}
116+
</Button>
96117
</div>
97118
</form>
98119
<button
99-
className="absolute btn btn-md text-sxl btn-circle btn-ghost right-2 top-2"
120+
className="absolute btn btn-md text-xl btn-ghost right-2 top-2 text-hacktoberfest-light transition-all duration-200"
100121
onClick={handleCloseClick}
101122
>
102123
✕
103124
</button>
104125
</div>
105126
) : (
106-
<div className="flex items-center justify-center mt-5">
107-
<span className="text-hacktoberfest-green">
127+
<div className="flex items-center justify-center p-6">
128+
<span className="text-hacktoberfest-light text-lg font-medium">
108129
This repository is already reported and in review
109130
</span>
110131
</div>
111132
)
112133
) : (
113-
<div className="flex items-center justify-center mt-5">
114-
<button
115-
className="text-black capitalize btn bg-hacktoberfest-light hover:bg-hacktoberfest-light-green"
116-
onClick={() => signIn('github')}
117-
>
118-
<BsGithub className="w-6 h-6 mr-1" />
134+
<div className="flex flex-col items-center justify-center p-8">
135+
<p className="text-hacktoberfest-light text-lg mb-4 text-center">
136+
Please sign in to report this repository
137+
</p>
138+
<Button onClick={() => signIn('github')}>
139+
<BsGithub className="w-6 h-6 mr-2" />
119140
Sign in with GitHub
120-
</button>
141+
</Button>
121142
</div>
122143
)}
123144
</div>

‎src/xata.ts‎

Lines changed: 129 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,146 @@
11
// Generated by Xata Codegen 0.30.1. Please do not edit.
2-
import { buildClient } from '@xata.io/client';
2+
import { buildClient } from "@xata.io/client";
33
import type {
44
BaseClientOptions,
55
SchemaInference,
6-
XataRecord
7-
} from '@xata.io/client';
6+
XataRecord,
7+
} from "@xata.io/client";
88

9-
const tables = [] as const;
9+
const tables = [
10+
{
11+
name: "reports",
12+
columns: [
13+
{ name: "repoId", type: "int", unique: true },
14+
{ name: "repoAuthor", type: "string" },
15+
{
16+
name: "message",
17+
type: "text",
18+
notNull: true,
19+
defaultValue: "No Message",
20+
},
21+
{ name: "user", type: "link", link: { table: "nextauth_users" } },
22+
{ name: "valid", type: "bool", notNull: true, defaultValue: "true" },
23+
{ name: "repoUrl", type: "string", unique: true },
24+
],
25+
},
26+
{
27+
name: "nextauth_users",
28+
columns: [
29+
{ name: "email", type: "email" },
30+
{ name: "emailVerified", type: "datetime" },
31+
{ name: "name", type: "string" },
32+
{ name: "image", type: "string" },
33+
],
34+
revLinks: [
35+
{ column: "user", table: "reports" },
36+
{ column: "user", table: "nextauth_accounts" },
37+
{ column: "user", table: "nextauth_users_accounts" },
38+
{ column: "user", table: "nextauth_users_sessions" },
39+
{ column: "user", table: "nextauth_sessions" },
40+
{ column: "user", table: "bookmarks" },
41+
],
42+
},
43+
{
44+
name: "nextauth_accounts",
45+
columns: [
46+
{ name: "user", type: "link", link: { table: "nextauth_users" } },
47+
{ name: "type", type: "string" },
48+
{ name: "provider", type: "string" },
49+
{ name: "providerAccountId", type: "string" },
50+
{ name: "refresh_token", type: "string" },
51+
{ name: "access_token", type: "string" },
52+
{ name: "expires_at", type: "int" },
53+
{ name: "token_type", type: "string" },
54+
{ name: "scope", type: "string" },
55+
{ name: "id_token", type: "text" },
56+
{ name: "session_state", type: "string" },
57+
],
58+
revLinks: [{ column: "account", table: "nextauth_users_accounts" }],
59+
},
60+
{
61+
name: "nextauth_verificationTokens",
62+
columns: [
63+
{ name: "identifier", type: "string" },
64+
{ name: "token", type: "string" },
65+
{ name: "expires", type: "datetime" },
66+
],
67+
},
68+
{
69+
name: "nextauth_users_accounts",
70+
columns: [
71+
{ name: "user", type: "link", link: { table: "nextauth_users" } },
72+
{ name: "account", type: "link", link: { table: "nextauth_accounts" } },
73+
],
74+
},
75+
{
76+
name: "nextauth_users_sessions",
77+
columns: [
78+
{ name: "user", type: "link", link: { table: "nextauth_users" } },
79+
{ name: "session", type: "link", link: { table: "nextauth_sessions" } },
80+
],
81+
},
82+
{
83+
name: "nextauth_sessions",
84+
columns: [
85+
{ name: "sessionToken", type: "string" },
86+
{ name: "expires", type: "datetime" },
87+
{ name: "user", type: "link", link: { table: "nextauth_users" } },
88+
],
89+
revLinks: [{ column: "session", table: "nextauth_users_sessions" }],
90+
},
91+
{
92+
name: "bookmarks",
93+
columns: [
94+
{ name: "user", type: "link", link: { table: "nextauth_users" } },
95+
],
96+
},
97+
] as const;
1098

1199
export type SchemaTables = typeof tables;
12100
export type InferredTypes = SchemaInference<SchemaTables>;
13101

14-
export type DatabaseSchema = {};
102+
export type Reports = InferredTypes["reports"];
103+
export type ReportsRecord = Reports & XataRecord;
104+
105+
export type NextauthUsers = InferredTypes["nextauth_users"];
106+
export type NextauthUsersRecord = NextauthUsers & XataRecord;
107+
108+
export type NextauthAccounts = InferredTypes["nextauth_accounts"];
109+
export type NextauthAccountsRecord = NextauthAccounts & XataRecord;
110+
111+
export type NextauthVerificationTokens =
112+
InferredTypes["nextauth_verificationTokens"];
113+
export type NextauthVerificationTokensRecord = NextauthVerificationTokens &
114+
XataRecord;
115+
116+
export type NextauthUsersAccounts = InferredTypes["nextauth_users_accounts"];
117+
export type NextauthUsersAccountsRecord = NextauthUsersAccounts & XataRecord;
118+
119+
export type NextauthUsersSessions = InferredTypes["nextauth_users_sessions"];
120+
export type NextauthUsersSessionsRecord = NextauthUsersSessions & XataRecord;
121+
122+
export type NextauthSessions = InferredTypes["nextauth_sessions"];
123+
export type NextauthSessionsRecord = NextauthSessions & XataRecord;
124+
125+
export type Bookmarks = InferredTypes["bookmarks"];
126+
export type BookmarksRecord = Bookmarks & XataRecord;
127+
128+
export type DatabaseSchema = {
129+
reports: ReportsRecord;
130+
nextauth_users: NextauthUsersRecord;
131+
nextauth_accounts: NextauthAccountsRecord;
132+
nextauth_verificationTokens: NextauthVerificationTokensRecord;
133+
nextauth_users_accounts: NextauthUsersAccountsRecord;
134+
nextauth_users_sessions: NextauthUsersSessionsRecord;
135+
nextauth_sessions: NextauthSessionsRecord;
136+
bookmarks: BookmarksRecord;
137+
};
15138

16139
const DatabaseClient = buildClient();
17140

18141
const defaultOptions = {
19142
databaseURL:
20-
'https://Adnan-Arodiya-s-workspace-4n85nl.eu-central-1.xata.sh/db/hacktoberfest-projects'
143+
"https://Adnan-Arodiya-s-workspace-4n85nl.eu-central-1.xata.sh/db/hacktoberfest-projects",
21144
};
22145

23146
export class XataClient extends DatabaseClient<DatabaseSchema> {

0 commit comments

Comments
 (0)