selimaj-dev/klayrion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dashboard completed

Browse Source
This commit is contained in:
selimaj-dev
2025-02-15 21:38:09 +01:00
parent eac41ab14b
commit 1b04a65333
3 changed files with 47 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/dashboard/page.tsx
+25 -16
View File
@@ -1,16 +1,14 @@
import AccountStatus from '@/components/accountStatus';
import Engagement from '@/components/engagement';
import Ideas from '@/components/ideas';
import RecentPosts from '@/components/recentPosts';
import { Calendar } from '@/components/ui/calendar';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Checkbox } from '@/components/ui/checkbox';
import {
SidebarProvider,
Sidebar,
SidebarContent,
} from '@/components/ui/sidebar';
import { DayPicker } from 'react-day-picker';
export default function Dashboard() {
return (
@@ -60,16 +58,24 @@ export default function Dashboard() {
},
]}
/>
<Ideas
ideas={[
<AccountStatus
accounts={[
{
idea: 'The recent Linus tech tips drama',
checked: true,
name: 'Klesti Selimaj',
ok: true,
platform: 'linkedin',
},
{ idea: 'Code reviews', checked: false },
{
idea: 'How to build charts in react',
checked: false,
name: 'Klesti Selimaj',
ok: true,
platform: 'x',
},
{
name: 'Leo Codes',
ok: false,
platform: 'x',
},
]}
/>
@@ -78,17 +84,20 @@ export default function Dashboard() {
posts={[
{
platform: 'x',
name: 'Leo Codes',
username: 'leo.codes',
name: 'Klesti Selimaj',
profileUrl:
'https://media.licdn.com/dms/image/v2/D5603AQE1lZ2aRsKrhw/profile-displayphoto-shrink_400_400/B56ZRxUoLuHoAg-/0/1737068022127?e=1744848000&v=beta&t=k2T9tdzNyJMmSO8GsT6D2qQmYUQxJRsHbooywDxEDJQ',
content:
"The linus tech tips drama is complex, don't know who to blame, they should try to figure this out privately",
date: new Date(),
},
{
platform: 'x',
name: 'Leo Codes',
username: 'leo.codes',
content:
"Hello, world",
name: 'Klesti Selimaj',
profileUrl:
'https://media.licdn.com/dms/image/v2/D5603AQE1lZ2aRsKrhw/profile-displayphoto-shrink_400_400/B56ZRxUoLuHoAg-/0/1737068022127?e=1744848000&v=beta&t=k2T9tdzNyJMmSO8GsT6D2qQmYUQxJRsHbooywDxEDJQ',
content: 'Hello, world',
date: new Date(),
},
]}
/>
src/components/recentPosts.tsx
+21 -6
View File
@@ -1,13 +1,16 @@
import { PlatformKind } from '@/utils';
import { Card, CardContent, CardHeader, CardTitle } from './ui/card';
import { PlatformIcon } from './icons';
import { format } from 'date-fns';
export default function RecentPosts({
posts,
}: {
posts: {
platform: PlatformKind;
profileUrl: string;
name: string;
username: string;
date: Date;
content: string;
}[];
}) {
@@ -17,24 +20,36 @@ export default function RecentPosts({
<CardTitle>Recent posts</CardTitle>
</CardHeader>
<CardContent className="w-full flex flex-col gap-5">
<CardContent className="w-full grid grid-rows-2 gap-4 items-stretch">
{posts.map((post, i) => (
// <div className="border flex flex-col h-full p-4 rounded-xl" key={i}>
// {post.content}
// </div>
<div
key={i}
className="flex-1 flex flex-col w-full border p-3 rounded-xl"
className="border flex flex-col h-full p-4 rounded-xl"
>
<div className="relative">
<div className="flex items-center w-full">
<img
src="/pfp"
src={post.profileUrl}
alt="PFP"
className="size-12 rounded-full"
/>
<p className="ml-4">{post.name}</p>
<PlatformIcon
platform={post.platform}
width={20}
height={20}
className="ml-1"
/>
<p className="ml-1 text-muted-foreground">
{format(post.date, 'MMM dd h:mm aa')}
</p>
</div>
</div>
<div className="w-full mt-2">
<p>{post.content}</p>
<div className="w-full mt-2 flex-1">
<p className="line-clamp-2">{post.content}</p>
</div>
</div>
))}
src/utils.ts
+1 -1
View File
@@ -7,7 +7,7 @@ export function generateUrlSafeString(length = 16) {
return Array.from(array, (byte) => chars[byte % chars.length]).join('');
}
export type PlatformKind = 'x';
export type PlatformKind = 'x' | 'linkedin';
export interface Platform {
platform: PlatformKind;