refactor/data-manager-communities-channels

README.md

@@ -1,248 +1,24 @@
 # Universes
 
-> Explore infinite universes of communities, conversations, and connections on the decentralized web
-
-Universes is a modern Nostr client that brings Discord-like community features to the decentralized Nostr protocol. Built with React, TypeScript, and cutting-edge web technologies, it offers a rich social experience with chat, marketplace, resources, and more.
-
-## ✨ Features
-
-### 🌐 **Decentralized Communities**
-- Create and join communities with organized channels
-- Discord-like interface with familiar UX patterns
-- Real-time messaging and conversations
-- Thread support for organized discussions
-
-### 💬 **Advanced Chat System**
-- Real-time messaging with typing indicators
-- Message reactions and emoji support
-- File uploads via Blossom servers
-- Message threading and replies
-- Pinned messages
-- Context menus for message actions
-
-### 🛒 **Marketplace**
-- Buy and sell items with Bitcoin/Lightning
-- Community-specific marketplaces
-- Secure peer-to-peer transactions
-- Rich product listings with media
-
-### 📚 **Resource Sharing**
-- Organize and share valuable content
-- Folder-based resource management
-- Community resource libraries
-- Link sharing and previews
-
-### 👥 **Social Features**
-- User profiles with rich metadata
-- Friend systems and social connections
-- Direct messaging with NIP-44 encryption
-- User status indicators
-- Notification center
-
-### 🛡️ **Moderation & Safety**
-- Comprehensive moderation tools
-- Admin panels and permissions
-- Content reporting system
-- Bulk moderation actions
-- Auto-moderation settings
-- Moderation logs and analytics
-
-### 🔐 **Privacy & Security**
-- NIP-44 encrypted direct messages
-- Multiple account support
-- Secure key management
-- Privacy-focused design
-
-### 🎨 **Modern UI/UX**
-- Beautiful dark/light theme system
-- Responsive design for all devices
-- Smooth animations and transitions
-- Accessible components with Radix UI
-- Professional Discord-inspired interface
+A modern Nostr client for decentralized communities with Discord-like chat. Built with React, TypeScript, and the latest Nostr protocols.
 
 ## 🚀 Quick Start
 
-### Prerequisites
-
-- Node.js 18+ 
-- npm or yarn
-- A Nostr identity (created automatically if needed)
-
-### Installation
-
-1. **Clone the repository**
-   ```bash
-   git clone <repository-url>
-   cd universes
-   ```
-
-2. **Install dependencies**
-   ```bash
-   npm install
-   ```
-
-3. **Start development server**
-   ```bash
-   npm run dev
-   ```
-
-4. **Open your browser**
-   Navigate to `http://localhost:5173`
-
-### Building for Production
-
-```bash
-npm run build
-```
-
-### Running Tests
-
 ```bash
-npm test
-```
-
-## 🏗️ Technology Stack
-
-### Core Technologies
-- **React 18** - Modern React with hooks and concurrent features
-- **TypeScript** - Type-safe JavaScript development
-- **Vite** - Fast build tool and development server
-- **TailwindCSS 3** - Utility-first CSS framework
-
-### UI Components
-- **shadcn/ui** - Beautiful, accessible components built on Radix UI
-- **Radix UI** - Low-level UI primitives for accessibility
-- **Lucide React** - Beautiful icon library
-
-### Nostr Integration
-- **Nostrify** - Modern Nostr framework for web applications
-- **nostr-tools** - Core Nostr protocol utilities
-- **NIP-44** - Encrypted direct messaging
-- **NIP-19** - Bech32-encoded identifiers
-
-### State Management
-- **TanStack Query** - Powerful data fetching and caching
-- **React Context** - Global app state management
-- **Local Storage** - Persistent user preferences
-
-### Development Tools
-- **ESLint** - Code linting and quality
-- **Vitest** - Fast unit testing
-- **Testing Library** - Component testing utilities
-
-## 📁 Project Structure
-
-```
-src/
-├── components/          # Reusable UI components
-│   ├── auth/           # Authentication components
-│   ├── chat/           # Chat and messaging
-│   ├── comments/       # Comment system
-│   ├── community/      # Community management
-│   ├── dm/             # Direct messaging
-│   ├── layout/         # Layout components
-│   ├── moderation/     # Moderation tools
-│   ├── spaces/         # Marketplace & resources
-│   └── ui/             # shadcn/ui components
-├── hooks/              # Custom React hooks
-├── pages/              # Page components
-├── lib/                # Utility functions
-├── contexts/           # React contexts
-└── test/               # Testing utilities
-```
-
-## 🔧 Configuration
-
-### Relay Configuration
-
-The app connects to Nostr relays for data. Default relay is `wss://relay.nostr.band`, but users can switch between preset relays:
-
-- **Nostr.Band** - General purpose relay
-- **Damus** - Popular iOS client relay  
-- **Primal** - Caching relay with web client
-- **Ditto** - Community-focused relay
-
-### Theme System
-
-Built-in light/dark theme support with system preference detection:
-
-```typescript
-import { useTheme } from '@/hooks/useTheme';
-
-const { theme, setTheme } = useTheme();
-setTheme('dark' | 'light' | 'system');
-```
-
-### Environment Variables
-
-No environment variables required for basic functionality. The app works out-of-the-box with default Nostr relays.
-
-## 🎯 Usage Examples
-
-### Creating a Community
-
-```typescript
-import { useNostrPublish } from '@/hooks/useNostrPublish';
-
-const { mutate: createEvent } = useNostrPublish();
-
-// Create a community (NIP-72)
-createEvent({
-  kind: 34550,
-  content: JSON.stringify({
-    name: "My Community",
-    about: "A place for awesome discussions",
-    picture: "https://example.com/image.jpg"
-  }),
-  tags: [
-    ['d', 'my-community-id'],
-    ['name', 'My Community'],
-    ['about', 'A place for awesome discussions']
-  ]
-});
-```
-
-### Sending a Message
-
-```typescript
-import { useNostrPublish } from '@/hooks/useNostrPublish';
-
-const { mutate: createEvent } = useNostrPublish();
-
-// Send a chat message (NIP-28)
-createEvent({
-  kind: 42,
-  content: "Hello, community!",
-  tags: [
-    ['e', 'community-event-id', '', 'root'],
-    ['p', 'recipient-pubkey']
-  ]
-});
+git clone <repository-url>
+cd universes
+npm install
+npm run dev
 ```
 
-### Querying Events
+Open `http://localhost:5173` in your browser.
 
-```typescript
-import { useNostr } from '@nostrify/react';
-import { useQuery } from '@tanstack/react-query';
+## 🏗️ Tech Stack
 
-function useMessages(communityId: string) {
-  const { nostr } = useNostr();
-
-  return useQuery({
-    queryKey: ['messages', communityId],
-    queryFn: async ({ signal }) => {
-      const events = await nostr.query([{
-        kinds: [42],
-        '#e': [communityId],
-        limit: 50
-      }], { signal });
-
-      return events;
-    }
-  });
-}
-```
+- **React 18** + **TypeScript** + **Vite**
+- **TailwindCSS** + **shadcn/ui** components
+- **Nostrify** + **nostr-tools** for Nostr protocol
+- **TanStack Query** for data fetching
 
 ## 🔌 Nostr Protocol Features
 
@@ -266,94 +42,40 @@ function useMessages(communityId: string) {
 
 The app may use custom event kinds for specific features. See `NIP.md` (if present) for documentation of any custom protocol extensions.
 
-## 🧪 Testing
+### Core Feature Implementation
+
+| **System** | **Component** | **Event Kind(s)** | **NIP** | **Replaceable** | **Purpose** | **Key Tags** |
+|------------|---------------|-------------------|---------|-------------|-------------|--------------|
+| **Communities** | Community Definition | `34550` | NIP-72 | ✓ | Community metadata and moderator lists | `d` (ID), `name`, `description`, `p` (moderators) |
+| | Member Management | `34551/34552/34553` | NIP-72 Ext | ✓ | Approved/declined/banned member lists | `d` (community ref), `p` (member pubkeys) |
+| | | | | | *Note: Membership can be explicit (via 34551-34553 events) or implicit (community creator/moderators)* | |
+| | Content Reporting | `1984` | NIP-56 | | Report content/users for moderation | `e` (target event), `p` (target user), report type |
+| **Channels** | Channel Definition | `32807` | | ✓ | Channel metadata within communities | `d` (ID), `name`, `a` (`"34550:pubkey:universes"`) |
+| | Channel Permissions | `30143` | | ✓ | Access control for channels | `d` (community:channel), JSON content, `p` (user permissions) |
+| | Channel Messages | `9411` | NIP-28 | | Real-time chat in channels | `a` (community), `t` (channel), `e` (thread) |
+| | Message Replies | `1111` | NIP-22 | | Replies to any message (9411, 1, etc.) | `e` (root message), `p` (root author) |
+| | Community Posts | `1111` | NIP-22 | | Threaded discussions | `A` (root community), `e` (parent), `k` (parent kind) |
+| **Direct Messages** | Legacy DMs | `4` | NIP-04 | | Simple encrypted messages | `#p` (recipient), `authors` (sender) |
+| | Modern DMs | `1059` | NIP-17 | | Gift-wrapped encrypted messages | `#p` (recipient) |
+
+#### Event Format Notes
+
+**Current Implementation:**
+- Channel community references use: `a` tag = `"34550:pubkey:communitySlug"`
+- Where `communitySlug` is the human-readable name from the community's `d` tag (e.g., "universes", "bitcoin-builders")
+
+**Proposed Future Change:**
+- Use immutable unique IDs instead of slugs: `a` tag = `"34550:pubkey:uniqueId"`
+- **Problem with current approach:** If a community changes its name/slug, all channel references break
+- **Proposed solution:** Generate a unique, immutable ID (UUID/hash) for each community that never changes
+- This would make communities renameable without breaking existing channel references
 
-The project includes comprehensive testing setup:
+## 🧪 Testing
 
 ```bash
-# Run all tests
 npm test
-
-# Run tests in watch mode
-npm run test:watch
-
-# Run tests with coverage
-npm run test:coverage
-```
-
-### Testing Components
-
-```typescript
-import { render, screen } from '@testing-library/react';
-import { TestApp } from '@/test/TestApp';
-import { MyComponent } from './MyComponent';
-
-test('renders correctly', () => {
-  render(
-    <TestApp>
-      <MyComponent />
-    </TestApp>
-  );
-
-  expect(screen.getByText('Expected text')).toBeInTheDocument();
-});
-```
-
-## 🚀 Deployment
-
-### GitHub Pages
-
-```bash
-npm run build
-# Deploy dist/ folder to your hosting provider
 ```
 
-### Nostr Deploy
-
-```bash
-npm run deploy
-```
-
-Uses `nostr-deploy-cli` to deploy directly to Nostr relays.
-
-## 🤝 Contributing
-
-1. Fork the repository
-2. Create a feature branch: `git checkout -b feature/amazing-feature`
-3. Commit changes: `git commit -m 'Add amazing feature'`
-4. Push to branch: `git push origin feature/amazing-feature`
-5. Open a Pull Request
-
-### Development Guidelines
-
-- Follow TypeScript best practices
-- Use existing hooks and components when possible
-- Write tests for new features
-- Follow the established code style
-- Update documentation for new features
-
-## 📝 License
-
-This project is open source. See the LICENSE file for details.
-
-## 🙏 Acknowledgments
-
-- **Nostr Protocol** - Decentralized social networking protocol
-- **shadcn/ui** - Beautiful component library
-- **Nostrify** - Modern Nostr framework
-- **MKStack** - Development framework
-
 ---
 
 **Vibed with [MKStack](https://soapbox.pub/mkstack)** ⚡
-
-## 📞 Support
-
-- **Documentation**: Check the `/src` folder for detailed component documentation
-- **Issues**: Report bugs and feature requests via GitHub Issues
-- **Community**: Join Nostr communities to connect with other users
-- **Protocol**: Learn more about Nostr at [nostr.com](https://nostr.com)
-
----
-
-*Explore infinite universes of communities, conversations, and connections on the decentralized web.* 🌌

src/App.tsx

@@ -21,6 +21,7 @@ import { useUnreadNotificationCount } from '@/hooks/useNotifications';
 import { SettingsProvider } from '@/contexts/settings.tsx';
 import { SettingsDialog } from '@/components/user/SettingsDialog';
 import { DataManagerProvider } from '@/components/DataManagerProvider';
+import { RelayChangeHandler } from '@/components/RelayChangeHandler';
 
 import AppRouter from './AppRouter';
 
@@ -79,6 +80,7 @@ function AppContent() {
     <SettingsProvider>
         <MessageSystemProvider>
           <TooltipProvider>
+            <RelayChangeHandler />
             <QueryOptimizer />
             <Toaster />
             <Suspense>