Skip to content

Commit 27322d2

Browse files
rehanalamrehanalam
authored
Merge pull request #6 from rehanalam/feat/organization-page
feat(org): update orgs page
2 parents 409ecdd + 5fa5432 commit 27322d2

5 files changed

Lines changed: 116 additions & 60 deletions

File tree

‎src/app/page.tsx‎

Lines changed: 29 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,64 +1,36 @@
1-
import Image from "next/image";
1+
import { getAllOrganizations } from "@/lib/organization";
2+
import OrganizationCard from "@/components/organization/organization-card";
3+
import { Title } from "@/components/ui/title";
4+
import { Text } from "@/components/ui/text";
25

36
export default function Home() {
7+
const organizations = getAllOrganizations();
8+
49
return (
5-
<div className="flex items-center justify-center bg-zinc-50 font-sans dark:bg-black">
6-
<main className="flex w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black sm:items-start">
7-
<Image
8-
className="dark:invert"
9-
src="/next.svg"
10-
alt="Next.js logo"
11-
width={100}
12-
height={20}
13-
priority
14-
/>
15-
<div className="flex flex-col items-center gap-6 text-center sm:items-start sm:text-left">
16-
<h1 className="max-w-xs text-3xl font-semibold leading-10 tracking-tight text-black dark:text-zinc-50">
17-
To get started, edit the page.tsx file.
18-
</h1>
19-
<p className="max-w-md text-lg leading-8 text-zinc-600 dark:text-zinc-400">
20-
Looking for a starting point or more instructions? Head over to{" "}
21-
<a
22-
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
23-
className="font-medium text-zinc-950 dark:text-zinc-50"
24-
>
25-
Templates
26-
</a>{" "}
27-
or the{" "}
28-
<a
29-
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
30-
className="font-medium text-zinc-950 dark:text-zinc-50"
31-
>
32-
Learning
33-
</a>{" "}
34-
center.
35-
</p>
36-
</div>
37-
<div className="flex flex-col gap-4 text-base font-medium sm:flex-row">
38-
<a
39-
className="flex h-12 w-full items-center justify-center gap-2 rounded-full bg-foreground px-5 text-background transition-colors hover:bg-[#383838] dark:hover:bg-[#ccc] md:w-[158px]"
40-
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
41-
target="_blank"
42-
rel="noopener noreferrer"
43-
>
44-
<Image
45-
className="dark:invert"
46-
src="/vercel.svg"
47-
alt="Vercel logomark"
48-
width={16}
49-
height={16}
50-
/>
51-
Deploy Now
52-
</a>
53-
<a
54-
className="flex h-12 w-full items-center justify-center rounded-full border border-solid border-black/[.08] px-5 transition-colors hover:border-transparent hover:bg-black/[.04] dark:border-white/[.145] dark:hover:bg-[#1a1a1a] md:w-[158px]"
55-
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
56-
target="_blank"
57-
rel="noopener noreferrer"
58-
>
59-
Documentation
60-
</a>
10+
<div className="min-h-screen bg-zinc-50 dark:bg-black">
11+
<main className="container mx-auto px-4 py-16 max-w-7xl">
12+
<div className="mb-12 text-center">
13+
<Title level={1} variant="lg" className="mb-4">
14+
Organizations
15+
</Title>
16+
<Text variant="md" color="text-zinc-600 dark:text-zinc-400">
17+
Select an organization to view its dashboard and manage services
18+
</Text>
6119
</div>
20+
21+
{organizations.length === 0 ? (
22+
<div className="text-center py-12">
23+
<Text variant="md" color="text-zinc-500">
24+
No organizations available
25+
</Text>
26+
</div>
27+
) : (
28+
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
29+
{organizations.map((org) => (
30+
<OrganizationCard key={org.id} organization={org} />
31+
))}
32+
</div>
33+
)}
6234
</main>
6335
</div>
6436
);

‎src/components/onboarding/onboarding-success.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ export function OnboardingSuccess({ organizationId, onBack }: OnboardingSuccessP
3939
Back
4040
</Button>
4141
<Link href={`/organization/${organizationId}/recipes/oauth-recipe`}>
42-
<Button>Start Config Recipe</Button>
42+
<Button>Start Recipe</Button>
4343
</Link>
4444
</div>
4545
</div>

‎src/components/onboarding/onboarding-wizard.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ export function OnboardingWizard({ organizationId }: OnboardingWizardProps) {
3939
<div className="max-w-3xl mx-auto p-6 space-y-6 bg-white shadow rounded">
4040
<div className="flex items-center">
4141
<Title level={2} className="flex-2">
42-
Setup Authlete
42+
Authlete Onboarding
4343
</Title>
4444
<div className="flex gap-2 flex-1 items-center">
4545
<p className="w-40 text-sm text-gray-600">

‎src/components/organization/organization-card.tsx‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
"use client";
2+
3+
import Link from "next/link";
4+
import { Organization } from "@/types";
5+
import {
6+
Card,
7+
CardHeader,
8+
CardTitle,
9+
CardDescription,
10+
CardContent,
11+
CardFooter,
12+
} from "@/components/ui/card";
13+
import { Button } from "@/components/ui/button";
14+
import { Building2 } from "lucide-react";
15+
16+
interface OrganizationCardProps {
17+
organization: Organization;
18+
}
19+
20+
export default function OrganizationCard({ organization }: OrganizationCardProps) {
21+
return (
22+
<Card className="hover:shadow-md transition-shadow cursor-pointer h-full flex flex-col">
23+
<CardHeader>
24+
<div className="flex items-start justify-between">
25+
<div className="flex items-center gap-3">
26+
<div className="p-2 bg-blue-100 dark:bg-blue-900 rounded-lg">
27+
<Building2 className="w-5 h-5 text-blue-600 dark:text-blue-400" />
28+
</div>
29+
<div>
30+
<CardTitle className="text-lg">{organization.name}</CardTitle>
31+
<CardDescription className="mt-1">ID: {organization.id}</CardDescription>
32+
</div>
33+
</div>
34+
</div>
35+
</CardHeader>
36+
<CardContent className="flex-1">
37+
<p className="text-sm text-muted-foreground">
38+
{organization.description || "No description available"}
39+
</p>
40+
<div className="mt-4 space-y-2">
41+
<div className="flex items-center justify-between text-xs">
42+
<span className="text-muted-foreground">API Server ID:</span>
43+
<span className="font-medium">{organization.apiServerId}</span>
44+
</div>
45+
</div>
46+
</CardContent>
47+
<CardFooter>
48+
<Link href={`/organization/${organization.id}`} className="w-full">
49+
<Button className="w-full" variant="default">
50+
View Organization
51+
</Button>
52+
</Link>
53+
</CardFooter>
54+
</Card>
55+
);
56+
}

‎src/lib/organization.ts‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,35 @@ export const ORGANIZATIONS: Record<string, Organization> = {
1414
"363934947538147": {
1515
id: "363934947538147",
1616
name: "Rehan Org FREE",
17-
description: "Default organization",
17+
description: "Default organization for testing and development",
18+
accessToken: getAccessToken(),
19+
apiServerId: 76281,
20+
},
21+
"123456789012345": {
22+
id: "123456789012345",
23+
name: "Acme Corporation",
24+
description: "Enterprise organization with production services",
25+
accessToken: getAccessToken(),
26+
apiServerId: 76281,
27+
},
28+
"987654321098765": {
29+
id: "987654321098765",
30+
name: "TechStart Inc",
31+
description: "Startup organization focused on innovation",
32+
accessToken: getAccessToken(),
33+
apiServerId: 76281,
34+
},
35+
"555555555555555": {
36+
id: "555555555555555",
37+
name: "Global Solutions",
38+
description: "Multi-region organization with global presence",
39+
accessToken: getAccessToken(),
40+
apiServerId: 76281,
41+
},
42+
"111111111111111": {
43+
id: "111111111111111",
44+
name: "Dev Team Alpha",
45+
description: "Development team organization for internal projects",
1846
accessToken: getAccessToken(),
1947
apiServerId: 76281,
2048
},

0 commit comments

Comments
 (0)