yusufipek/OpenFrame
1
0
Fork 0
mirror of https://github.com/yusufipk/OpenFrame.git synced 2026-09-12 01:46:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: Enhance dashboard responsiveness across various pages and update project visibility icons for improved clarity.

Browse Source
This commit is contained in:
Yusuf İpek
2026-02-20 14:28:43 +03:00
parent fe496b7fa5
commit 1bb1c8e574
12 changed files with 525 additions and 512 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/(dashboard)/projects/[projectId]/members/page.tsx
+8 -8
View File
@@ -195,8 +195,8 @@ export default function ProjectMembersPage() {
</CardDescription>
</CardHeader>
<CardContent>
<form onSubmit={handleInvite} className="flex gap-3 items-end">
<div className="flex-1">
<form onSubmit={handleInvite} className="flex flex-col sm:flex-row gap-3 sm:items-end">
<div className="w-full sm:flex-1">
<Label htmlFor="email" className="mb-2 block">Email Address</Label>
<Input
id="email"
@@ -208,7 +208,7 @@ export default function ProjectMembersPage() {
disabled={isInviting}
/>
</div>
<div className="w-40">
<div className="w-full sm:w-40">
<Label className="mb-2 block">Role</Label>
<Select value={inviteRole} onValueChange={(v) => setInviteRole(v as 'ADMIN' | 'COMMENTATOR')}>
<SelectTrigger className="w-full">
@@ -220,7 +220,7 @@ export default function ProjectMembersPage() {
</SelectContent>
</Select>
</div>
<Button type="submit" disabled={isInviting}>
<Button type="submit" disabled={isInviting} className="w-full sm:w-auto">
{isInviting ? (
<Loader2 className="h-4 w-4 animate-spin" />
) : (
@@ -257,7 +257,7 @@ export default function ProjectMembersPage() {
<CardContent className="space-y-3">
{/* Owner */}
{owner && (
<div className="flex items-center justify-between p-3 rounded-lg bg-accent/30">
<div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4 sm:gap-0 p-3 rounded-lg bg-accent/30">
<div className="flex items-center gap-3">
<Avatar className="h-9 w-9">
<AvatarImage src={owner.image ?? undefined} />
@@ -277,7 +277,7 @@ export default function ProjectMembersPage() {
{/* Members */}
{members.map((member) => (
<div key={member.id} className="flex items-center justify-between p-3 rounded-lg border">
<div key={member.id} className="flex flex-col sm:flex-row sm:items-center justify-between gap-4 sm:gap-0 p-3 rounded-lg border">
<div className="flex items-center gap-3">
<Avatar className="h-9 w-9">
<AvatarImage src={member.user.image ?? undefined} />
@@ -288,12 +288,12 @@ export default function ProjectMembersPage() {
<p className="text-xs text-muted-foreground">{member.user.email}</p>
</div>
</div>
<div className="flex items-center gap-2">
<div className="flex items-center gap-2 w-full sm:w-auto">
<Select
value={member.role}
onValueChange={(v) => handleRoleChange(member.id, v)}
>
<SelectTrigger className="w-36 h-8">
<SelectTrigger className="w-full sm:w-36 h-8">
<SelectValue />
</SelectTrigger>
<SelectContent>
app/(dashboard)/projects/[projectId]/project-content-client.tsx
+7 -4
View File
@@ -11,6 +11,9 @@ import {
Building2,
ArrowUp,
ArrowDown,
Globe,
UserPlus,
Lock,
} from 'lucide-react';
import { Button } from '@/components/ui/button';
import { Card, CardContent } from '@/components/ui/card';
@@ -71,9 +74,9 @@ export function ProjectContentClient({
<div className="flex items-center gap-2 mb-1">
<h1 className="text-3xl font-bold tracking-tight">{project.name}</h1>
<Badge variant="outline" className="flex items-center gap-1">
{project.visibility === 'PUBLIC' && <span className="text-xs">🌐</span>}
{project.visibility === 'INVITE' && <span className="text-xs">📧</span>}
{project.visibility === 'PRIVATE' && <span className="text-xs">🔒</span>}
{project.visibility === 'PUBLIC' && <Globe className="h-3 w-3" />}
{project.visibility === 'INVITE' && <UserPlus className="h-3 w-3" />}
{project.visibility === 'PRIVATE' && <Lock className="h-3 w-3" />}
{project.visibility.toLowerCase()}
</Badge>
</div>
@@ -92,7 +95,7 @@ export function ProjectContentClient({
</div>
</div>
<div className="flex items-center gap-2">
<div className="flex flex-wrap items-center gap-2 mt-4 sm:mt-0">
{/* Sort Button - Left of Share */}
<Button
variant="outline"
app/(dashboard)/projects/[projectId]/settings/page.tsx
+2 -2
View File
@@ -362,7 +362,7 @@ export default function ProjectSettingsPage({ params }: ProjectSettingsPageProps
{/* Existing tags */}
<div className="space-y-2">
{tags.map((tag) => (
<div key={tag.id} className="flex items-center gap-2 p-2 rounded-lg border bg-card">
<div key={tag.id} className="flex flex-wrap items-center gap-2 p-2 rounded-lg border bg-card">
{editingTagId === tag.id ? (
<>
<input
@@ -417,7 +417,7 @@ export default function ProjectSettingsPage({ params }: ProjectSettingsPageProps
</div>
{/* Add new tag */}
<div className="flex items-center gap-2 pt-2 border-t">
<div className="flex flex-wrap items-center gap-2 pt-2 border-t">
<input
type="color"
value={newTagColor}
app/(dashboard)/projects/[projectId]/videos/new/page.tsx
+1 -1
View File
@@ -224,7 +224,7 @@ export default function NewVideoPage() {
</p>
)}
<div className="flex gap-3">
<div className="flex flex-wrap gap-3">
<Button type="submit" disabled={isLoading || !videoSource}>
{isLoading && <Loader2 className="h-4 w-4 mr-2 animate-spin" />}
Add Video