- New SkateCrew kind 35006 + type/parser + useCrews/useCrew hooks - /crews directory, /create-crew, /edit-crew, /crew/:pubkey/:identifier pages - Reuses the collective engine: NIP-32 membership attestation (confirmed/pending), CollectiveMembers + ConfirmMembershipCard, ClinkPayButton, SpotPicker - Activity v1: home spots + crew member feed (no events, per plan) - Map: teal/cyan Crews layer at home turf with crew markers + popups; wired through SpotMap props, layer toggles (mobile popover + filters sheet), and mobileLayerCount badge - Nav: Crews added to navItemKeys (desktop header, mobile bottom bar, sidebar) with en/es i18n keys - NIP.md: documents kind 35006, tag taxonomy, and shared membership mechanism Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
85 lines
2.9 KiB
TypeScript
85 lines
2.9 KiB
TypeScript
import { useSeoMeta } from '@unhead/react';
|
|
import { Link, useParams } from 'react-router-dom';
|
|
import { Layout } from '@/components/Layout';
|
|
import { Card, CardContent } from '@/components/ui/card';
|
|
import { Skeleton } from '@/components/ui/skeleton';
|
|
import { LoginArea } from '@/components/auth/LoginArea';
|
|
import { CrewForm } from '@/components/CrewForm';
|
|
import { useCurrentUser } from '@/hooks/useCurrentUser';
|
|
import { useCrew } from '@/hooks/useCrews';
|
|
import NotFound from './NotFound';
|
|
import { Users, ArrowLeft } from 'lucide-react';
|
|
|
|
export default function EditCrewPage() {
|
|
const { pubkey, identifier } = useParams<{ pubkey: string; identifier: string }>();
|
|
const { user } = useCurrentUser();
|
|
const { data: crew, isLoading } = useCrew(identifier || '', pubkey);
|
|
|
|
useSeoMeta({
|
|
title: crew ? `Edit ${crew.name} - SkateSpots` : 'Edit Crew - SkateSpots',
|
|
description: 'Edit your skate crew.',
|
|
});
|
|
|
|
if (!user) {
|
|
return (
|
|
<Layout>
|
|
<div className="container px-4 py-8">
|
|
<Card className="max-w-xl mx-auto bg-gray-900 border-gray-700">
|
|
<CardContent className="py-12 text-center">
|
|
<Users className="h-12 w-12 mx-auto mb-4 text-gray-600" />
|
|
<h2 className="text-xl font-bold mb-2">Login Required</h2>
|
|
<LoginArea className="justify-center max-w-60 mx-auto" />
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</Layout>
|
|
);
|
|
}
|
|
|
|
if (isLoading) {
|
|
return (
|
|
<Layout>
|
|
<div className="container px-4 py-8 max-w-2xl">
|
|
<Skeleton className="h-6 w-32 mb-6" />
|
|
<Skeleton className="h-[600px] w-full" />
|
|
</div>
|
|
</Layout>
|
|
);
|
|
}
|
|
|
|
if (!crew) return <NotFound />;
|
|
|
|
// Only the crew's founder can edit it
|
|
if (crew.pubkey !== user.pubkey) {
|
|
return (
|
|
<Layout>
|
|
<div className="container px-4 py-8">
|
|
<Card className="max-w-xl mx-auto bg-gray-900 border-gray-700">
|
|
<CardContent className="py-12 text-center">
|
|
<Users className="h-12 w-12 mx-auto mb-4 text-gray-600" />
|
|
<h2 className="text-xl font-bold mb-2">Not your crew</h2>
|
|
<p className="text-gray-400">Only the crew founder can edit this crew.</p>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</Layout>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Layout>
|
|
<div className="container px-4 sm:px-6 py-6 sm:py-8 max-w-2xl">
|
|
<div className="mb-6">
|
|
<Link to={`/crew/${crew.pubkey}/${crew.identifier}`} className="inline-flex items-center text-gray-400 hover:text-white transition-colors mb-4">
|
|
<ArrowLeft className="h-4 w-4 mr-2" />
|
|
Back to Crew
|
|
</Link>
|
|
<h1 className="text-3xl font-black uppercase text-teal-400" style={{ fontFamily: 'Impact, "Arial Black", sans-serif' }}>
|
|
Edit Crew
|
|
</h1>
|
|
</div>
|
|
<CrewForm existing={crew} />
|
|
</div>
|
|
</Layout>
|
|
);
|
|
}
|