@propbinder/mobile-design 0.2.48 → 0.2.50

package/src/services/posts.service.ts

@@ -0,0 +1,542 @@
+import { Injectable, signal, computed } from '@angular/core';
+import { Post, Comment } from '../models/post.model';
+
+/**
+ * PostsService
+ * 
+ * Centralized service for managing community posts.
+ * Provides a single source of truth for post data, including comments.
+ * 
+ * Features:
+ * - CRUD operations for posts
+ * - Infinite scroll pagination
+ * - Post search/filter (future)
+ * - Comment management (future)
+ */
+@Injectable({
+  providedIn: 'root'
+})
+export class PostsService {
+  // Private signal for internal state management
+  private postsState = signal<Post[]>(this.getInitialPosts());
+  
+  // Public computed signal (read-only)
+  posts = computed(() => this.postsState());
+  
+  // Pagination state for infinite scroll
+  private currentPage = signal(0);
+  private hasMore = signal(true);
+  
+  constructor() {}
+  
+  /**
+   * Get a post by ID
+   */
+  getPostById(id: string): Post | undefined {
+    return this.postsState().find(post => post.id === id);
+  }
+  
+  /**
+   * Add a new post (e.g., from post creator)
+   * Adds to the beginning of the list
+   */
+  addPost(post: Post): void {
+    this.postsState.update(posts => [post, ...posts]);
+  }
+  
+  /**
+   * Update an existing post
+   */
+  updatePost(id: string, updates: Partial<Post>): void {
+    this.postsState.update(posts =>
+      posts.map(post => post.id === id ? { ...post, ...updates } : post)
+    );
+  }
+  
+  /**
+   * Delete a post by ID
+   */
+  deletePost(id: string): void {
+    this.postsState.update(posts => posts.filter(post => post.id !== id));
+  }
+  
+  /**
+   * Load more posts for infinite scroll
+   * Returns true if more posts were loaded, false if no more posts
+   */
+  async loadMorePosts(): Promise<boolean> {
+    const page = this.currentPage();
+    const itemsPerPage = 2;
+    const additionalPosts = this.getAdditionalPosts();
+    const startIndex = page * itemsPerPage;
+    const endIndex = startIndex + itemsPerPage;
+    
+    // Simulate API delay
+    await new Promise(resolve => setTimeout(resolve, 1000));
+    
+    // Get next batch
+    const newPosts = additionalPosts.slice(startIndex, endIndex);
+    
+    if (newPosts.length > 0) {
+      // Append to existing posts
+      this.postsState.update(posts => [...posts, ...newPosts]);
+      this.currentPage.update(p => p + 1);
+      
+      // Check if there are more posts
+      if (endIndex >= additionalPosts.length) {
+        this.hasMore.set(false);
+      }
+      
+      return true;
+    }
+    
+    this.hasMore.set(false);
+    return false;
+  }
+  
+  /**
+   * Check if there are more posts to load
+   */
+  hasMorePosts(): boolean {
+    return this.hasMore();
+  }
+  
+  /**
+   * Reset pagination (e.g., on pull-to-refresh)
+   */
+  resetPagination(): void {
+    this.currentPage.set(0);
+    this.hasMore.set(true);
+  }
+  
+  /**
+   * Get initial posts (shown on page load)
+   */
+  private getInitialPosts(): Post[] {
+    return [
+      {
+        id: 'user-post-1',
+        authorName: 'Lars Mikkelsen',
+        authorRole: 'Dig',
+        timestamp: '5m siden',
+        avatarType: 'initials',
+        avatarInitials: 'LM',
+        content: 'Dette er mit første opslag! Ser frem til at forbinde med alle i bygningen. 🏠',
+        isLiked: false,
+        likeCount: 3,
+        commentCount: 1,
+        comments: []
+      },
+      {
+        id: 'post-1',
+        authorName: 'Anders Jensen',
+        authorRole: 'Lejer',
+        timestamp: '2t siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=100&h=100&fit=crop&crop=face',
+        content: 'Lige flyttet ind i min nye lejlighed! Udlejeren var super hjælpsom gennem hele processen. Virkelig begejstret for at være en del af dette fællesskab! 🏠',
+        isLiked: false,
+        likeCount: 42,
+        commentCount: 12,
+        comments: [
+          {
+            id: 'comment-1-1',
+            authorName: 'Mette Larsen',
+            authorRole: 'Lejer',
+            timestamp: '1t siden',
+            avatarInitials: 'ML',
+            content: 'Velkommen til fællesskabet!',
+            likeCount: 1,
+            isLiked: false,
+            isOwnComment: false
+          },
+          {
+            id: 'comment-1-2',
+            authorName: 'Lars Mikkelsen',
+            authorRole: 'Dig',
+            timestamp: 'Lige nu',
+            avatarInitials: 'LM',
+            content: 'Vxhknbh',
+            likeCount: 1,
+            isLiked: false,
+            isOwnComment: true
+          }
+        ]
+      },
+      {
+        id: 'post-2',
+        authorName: 'Sophie Andersen',
+        authorRole: 'Lejer',
+        timestamp: '4t siden',
+        avatarInitials: 'SA',
+        avatarType: 'initials',
+        content: 'Jeg har taget nogle billeder af vores smukke ejendom i løbet af det sidste par måneder. Fra altanudsigten om morgenen til den nye trappe og fællesområderne. Elsker virkelig at bo her! 🏡✨',
+        hasInlinePhotos: true,
+        isLiked: true,
+        likeCount: 156,
+        commentCount: 34,
+        comments: [
+          {
+            id: 'comment-2-1',
+            authorName: 'Anders Jensen',
+            authorRole: 'Lejer',
+            timestamp: '3t siden',
+            avatarInitials: 'AJ',
+            content: 'Wow, den udsigt er fantastisk! Hvilken etage er du på?',
+            likeCount: 12,
+            isLiked: false,
+            isOwnComment: false
+          },
+          {
+            id: 'comment-2-2',
+            authorName: 'Thomas Hansen',
+            authorRole: 'Lejer',
+            timestamp: '3t siden',
+            avatarInitials: 'TH',
+            content: 'Smuk! Jeg kan også se byens silhuet fra min lejlighed 🌆',
+            isLiked: true,
+            likeCount: 8,
+            isOwnComment: false
+          },
+          {
+            id: 'comment-2-3',
+            authorName: 'Lars Mikkelsen',
+            authorRole: 'Dig',
+            timestamp: 'Lige nu',
+            avatarInitials: 'LM',
+            content: 'Vxhknbh',
+            likeCount: 1,
+            isLiked: false,
+            isOwnComment: true
+          }
+        ]
+      },
+      {
+        id: 'post-3',
+        authorName: 'Thomas Hansen',
+        authorRole: 'Lejer',
+        timestamp: '1d siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100&h=100&fit=crop&crop=face',
+        content: 'Kender nogen et fælles fitnesscenter i nærheden? Leder efter anbefalinger til gode træningscentre i området. 🏋️',
+        isLiked: false,
+        likeCount: 23,
+        commentCount: 45,
+        comments: []
+      },
+      {
+        id: 'post-3.5',
+        authorName: 'Karen Nielsen',
+        authorRole: 'Ejendomsadministrator',
+        timestamp: '2d siden',
+        avatarInitials: 'KN',
+        avatarType: 'initials',
+        showBadge: true,
+        isPinned: true,
+        content: 'Her er et kig på vores nyligt renoverede fællesområder! Vi har opgraderet postkasserne, trappeafsatsen og gårdområdet. Der er også blevet ansat en ny vicevært. Glæd dig over forbedringerne! 🏢✨',
+        hasInlinePhotos: true,
+        inlinePhotoCount: 6,
+        isLiked: false,
+        likeCount: 234,
+        commentCount: 89,
+        comments: []
+      },
+      {
+        id: 'post-4',
+        authorName: 'Karen Nielsen',
+        authorRole: 'Ejendomsadministrator',
+        timestamp: '2d siden',
+        avatarInitials: 'KN',
+        avatarType: 'initials',
+        showBadge: true,
+        isPinned: true,
+        content: '📢 Påmindelse: Bygningsvedligeholdelse planlagt til denne lørdag fra kl. 9 til 14. Vandet vil være midlertidigt lukket. Vær venlig at planlægge derefter!',
+        isLiked: false,
+        likeCount: 89,
+        commentCount: 67,
+        comments: []
+      },
+      {
+        id: 'post-5',
+        authorName: 'Emma Petersen',
+        authorRole: 'Lejer',
+        timestamp: '3d siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=100&h=100&fit=crop&crop=face',
+        content: 'Arrangerer en fælles BBQ næste weekend! Alle er inviteret. Tag din yndlingsret med til at dele. Lad os lære hinanden bedre at kende! 🍔🌭',
+        isLiked: true,
+        likeCount: 124,
+        commentCount: 89,
+        comments: []
+      }
+    ];
+  }
+  
+  /**
+   * Get additional posts for infinite scroll
+   */
+  private getAdditionalPosts(): Post[] {
+    return [
+      {
+        id: 'post-6',
+        authorName: 'Peter Christensen',
+        authorRole: 'Lejer',
+        timestamp: '4d siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=100&h=100&fit=crop&crop=face',
+        content: 'Nogen der ved, hvornår de nye cykelstativer bliver installeret? 🚲',
+        isLiked: false,
+        likeCount: 15,
+        commentCount: 23,
+        comments: []
+      },
+      {
+        id: 'post-7',
+        authorName: 'Maria Schmidt',
+        authorRole: 'Lejer',
+        timestamp: '5d siden',
+        avatarInitials: 'MS',
+        avatarType: 'initials',
+        content: 'Tak til vores fantastiske vicevært for at holde bygningen så pæn og ren! 🌟',
+        isLiked: true,
+        likeCount: 78,
+        commentCount: 12,
+        comments: []
+      },
+      {
+        id: 'post-8',
+        authorName: 'Jens Nielsen',
+        authorRole: 'Lejer',
+        timestamp: '6d siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1519345182560-3f2917c472ef?w=100&h=100&fit=crop&crop=face',
+        content: 'Jeg har fundet en nøgle i gården. Hvis den er din, så kontakt mig! 🔑',
+        isLiked: false,
+        likeCount: 8,
+        commentCount: 3,
+        comments: []
+      },
+      {
+        id: 'post-9',
+        authorName: 'Anna Larsen',
+        authorRole: 'Lejer',
+        timestamp: '1u siden',
+        avatarInitials: 'AL',
+        avatarType: 'initials',
+        content: 'Glædelig sommer til alle! ☀️ Håber I alle får en vidunderlig ferie!',
+        isLiked: true,
+        likeCount: 134,
+        commentCount: 45,
+        comments: []
+      },
+      {
+        id: 'post-10',
+        authorName: 'Michael Andersen',
+        authorRole: 'Lejer',
+        timestamp: '1u siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1506794778202-cad84cf45f1d?w=100&h=100&fit=crop&crop=face',
+        content: 'Er der nogen der kan anbefale en god pizzarestaurant i området? 🍕',
+        isLiked: false,
+        likeCount: 32,
+        commentCount: 67,
+        comments: []
+      },
+      {
+        id: 'post-11',
+        authorName: 'Camilla Jensen',
+        authorRole: 'Lejer',
+        timestamp: '2u siden',
+        avatarInitials: 'CJ',
+        avatarType: 'initials',
+        content: 'Hej alle! Jeg overvejer at starte en bogklub. Er der nogen interesserede? 📚',
+        isLiked: false,
+        likeCount: 42,
+        commentCount: 28,
+        comments: []
+      },
+      {
+        id: 'post-12',
+        authorName: 'Henrik Madsen',
+        authorRole: 'Lejer',
+        timestamp: '2u siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1568602471122-7832951cc4c5?w=100&h=100&fit=crop&crop=face',
+        content: 'Vores fælles have ser fantastisk ud i år! Stor ros til haveudvalget! 🌻🌸',
+        isLiked: true,
+        likeCount: 95,
+        commentCount: 18,
+        comments: []
+      },
+      {
+        id: 'post-13',
+        authorName: 'Louise Berg',
+        authorRole: 'Lejer',
+        timestamp: '3u siden',
+        avatarInitials: 'LB',
+        avatarType: 'initials',
+        content: 'Påmindelse: Generalforsamling næste mandag kl. 19. Håber at se jer alle! 📋',
+        isLiked: false,
+        likeCount: 56,
+        commentCount: 34,
+        comments: []
+      },
+      {
+        id: 'post-14',
+        authorName: 'Martin Olsen',
+        authorRole: 'Lejer',
+        timestamp: '3u siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1566492031773-4f4e44671857?w=100&h=100&fit=crop&crop=face',
+        content: 'Har nogen set min kat? Hun har været væk siden i går aftes. Hun hedder Luna og er grå. 🐱',
+        isLiked: false,
+        likeCount: 67,
+        commentCount: 45,
+        comments: []
+      },
+      {
+        id: 'post-15',
+        authorName: 'Sarah Thomsen',
+        authorRole: 'Lejer',
+        timestamp: '4u siden',
+        avatarInitials: 'ST',
+        avatarType: 'initials',
+        content: 'Super godt initiativ med de nye genbrugsstationer! Gør det meget nemmere at sortere affald 💚♻️',
+        isLiked: true,
+        likeCount: 123,
+        commentCount: 21,
+        comments: []
+      },
+      {
+        id: 'post-16',
+        authorName: 'Nikolaj Hansen',
+        authorRole: 'Lejer',
+        timestamp: '5u siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1570295999919-56ceb5ecca61?w=100&h=100&fit=crop&crop=face',
+        content: 'Leder efter en pålídelig babysitter i bygningen. Kender I nogen? Tak! 👶',
+        isLiked: false,
+        likeCount: 12,
+        commentCount: 9,
+        comments: []
+      },
+      {
+        id: 'post-17',
+        authorName: 'Isabella Larsen',
+        authorRole: 'Lejer',
+        timestamp: '6u siden',
+        avatarInitials: 'IL',
+        avatarType: 'initials',
+        content: 'Vi holder en lille julemarked i gården på lørdag! Kom og køb håndlavede ting og nyd varm kakao! 🎄☕',
+        isLiked: true,
+        likeCount: 187,
+        commentCount: 56,
+        comments: []
+      },
+      {
+        id: 'post-18',
+        authorName: 'Frederik Nielsen',
+        authorRole: 'Lejer',
+        timestamp: '7u siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1599566150163-29194dcaad36?w=100&h=100&fit=crop&crop=face',
+        content: 'Er der nogen der vil være med til at starte en løbeklub? Tænker 2-3 gange om ugen. 🏃‍♂️',
+        isLiked: false,
+        likeCount: 38,
+        commentCount: 41,
+        comments: []
+      },
+      {
+        id: 'post-19',
+        authorName: 'Sofie Petersen',
+        authorRole: 'Lejer',
+        timestamp: '1d siden',
+        avatarInitials: 'SP',
+        avatarType: 'initials',
+        content: 'Fantastisk sammenkomst i går aftes! Tusind tak til alle der kom. Vi skal gøre det igen snart! 🎉',
+        isLiked: true,
+        likeCount: 156,
+        commentCount: 72,
+        comments: []
+      },
+      {
+        id: 'post-20',
+        authorName: 'Christian Møller',
+        authorRole: 'Lejer',
+        timestamp: '1d siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1552058544-f2b08422138a?w=100&h=100&fit=crop&crop=face',
+        content: 'Nogen der har brug for hjælp med at flytte møbler? Jeg har en stor bil og kan hjælpe i weekenden! 🚐',
+        isLiked: false,
+        likeCount: 29,
+        commentCount: 15,
+        comments: []
+      },
+      {
+        id: 'post-21',
+        authorName: 'Laura Andersen',
+        authorRole: 'Lejer',
+        timestamp: '2d siden',
+        avatarInitials: 'LA',
+        avatarType: 'initials',
+        content: 'Jeg giver klavertimer hvis nogen er interesserede! Alle niveauer velkomne 🎹🎵',
+        isLiked: false,
+        likeCount: 44,
+        commentCount: 22,
+        comments: []
+      },
+      {
+        id: 'post-22',
+        authorName: 'Rasmus Schmidt',
+        authorRole: 'Lejer',
+        timestamp: '2d siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100&h=100&fit=crop&crop=face',
+        content: 'Vi har fået ny belysning i trappeopgangen! Så meget lysere nu om aftenen 💡',
+        isLiked: true,
+        likeCount: 89,
+        commentCount: 13,
+        comments: []
+      },
+      {
+        id: 'post-23',
+        authorName: 'Mette Hansen',
+        authorRole: 'Lejer',
+        timestamp: '3d siden',
+        avatarInitials: 'MH',
+        avatarType: 'initials',
+        content: 'Nogen der vil dele en Costco-medlemskab? Vi kan tage på indkøb sammen! 🛒',
+        isLiked: false,
+        likeCount: 18,
+        commentCount: 31,
+        comments: []
+      },
+      {
+        id: 'post-24',
+        authorName: 'Jonas Berg',
+        authorRole: 'Lejer',
+        timestamp: '3d siden',
+        avatarType: 'photo',
+        avatarSrc: 'https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=100&h=100&fit=crop&crop=face',
+        content: 'Har plantet nye blomster ved indgangen. Håber I kan lide dem! 🌷🌺',
+        isLiked: true,
+        likeCount: 142,
+        commentCount: 38,
+        comments: []
+      },
+      {
+        id: 'post-25',
+        authorName: 'Caroline Jensen',
+        authorRole: 'Lejer',
+        timestamp: '4d siden',
+        avatarInitials: 'CJ',
+        avatarType: 'initials',
+        content: 'Leder efter en tennismakker. Er der nogen der spiller? 🎾',
+        isLiked: false,
+        likeCount: 21,
+        commentCount: 17,
+        comments: []
+      }
+    ];
+  }
+}

package/src/services/tracking-permission.service.ts

@@ -0,0 +1,88 @@
+import { Injectable, inject, signal } from '@angular/core';
+import { Platform } from '@ionic/angular/standalone';
+import { AppTrackingStatus, AppTrackingTransparency } from 'capacitor-plugin-app-tracking-transparency';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class TrackingPermissionService {
+  private readonly trackingPromptRequestedKey = 'tracking_prompt_requested_v1';
+  private readonly platform = inject(Platform);
+  private readonly trackingSettingsReminder = signal(false);
+
+  readonly showTrackingSettingsReminder = this.trackingSettingsReminder.asReadonly();
+
+  async requestOnFirstHomeEntry(): Promise<void> {
+    if (!this.isNativeIos()) {
+      this.trackingSettingsReminder.set(false);
+      return;
+    }
+
+    if (this.hasRequestedTrackingPrompt()) {
+      await this.refreshTrackingStatus();
+      return;
+    }
+
+    try {
+      const { status } = await AppTrackingTransparency.getStatus();
+      if (status === 'notDetermined') {
+        await AppTrackingTransparency.requestPermission();
+      }
+    } catch (error) {
+      console.log('Unable to request app tracking permission:', error);
+    } finally {
+      this.setTrackingPromptRequested();
+      await this.refreshTrackingStatus();
+    }
+  }
+
+  async getTrackingStatus(): Promise<AppTrackingStatus | null> {
+    if (!this.isNativeIos()) {
+      return null;
+    }
+
+    try {
+      const { status } = await AppTrackingTransparency.getStatus();
+      return status;
+    } catch (error) {
+      console.log('Unable to read app tracking status:', error);
+      return null;
+    }
+  }
+
+  async openAppSettings(): Promise<void> {
+    if (!this.isNativeIos()) {
+      return;
+    }
+
+    // iOS deep link for opening this app's system settings page.
+    window.location.href = 'app-settings:';
+  }
+
+  shouldShowSettingsReminder(): boolean {
+    return this.trackingSettingsReminder();
+  }
+
+  async refreshTrackingStatus(): Promise<void> {
+    if (!this.isNativeIos()) {
+      this.trackingSettingsReminder.set(false);
+      return;
+    }
+
+    const status = await this.getTrackingStatus();
+    const hasRequested = this.hasRequestedTrackingPrompt();
+    this.trackingSettingsReminder.set(Boolean(hasRequested && status && status !== 'authorized'));
+  }
+
+  private isNativeIos(): boolean {
+    return this.platform.is('ios') && this.platform.is('capacitor');
+  }
+
+  private hasRequestedTrackingPrompt(): boolean {
+    return localStorage.getItem(this.trackingPromptRequestedKey) === '1';
+  }
+
+  private setTrackingPromptRequested(): void {
+    localStorage.setItem(this.trackingPromptRequestedKey, '1');
+  }
+}

package/src/services/user.service.ts

@@ -0,0 +1,60 @@
+import { Injectable, signal } from '@angular/core';
+import { Subject } from 'rxjs';
+import { ActionGroup, ActionResult } from '../components/bottom-sheet';
+
+/**
+ * User service for managing current user data globally
+ */
+@Injectable({
+  providedIn: 'root',
+})
+export class UserService {
+  // User avatar configuration
+  private _avatarInitials = signal('LM');
+  private _avatarType = signal<'initials' | 'photo' | 'icon'>('initials');
+  private _avatarSrc = signal('');
+
+  // Profile menu items configuration
+  private _profileMenuItems = signal<ActionGroup[] | undefined>(undefined);
+
+  // Readonly computed values
+  readonly avatarInitials = this._avatarInitials.asReadonly();
+  readonly avatarType = this._avatarType.asReadonly();
+  readonly avatarSrc = this._avatarSrc.asReadonly();
+  readonly profileMenuItems = this._profileMenuItems.asReadonly();
+
+  // Profile action selection notification
+  private profileActionSelectedSubject = new Subject<ActionResult>();
+  readonly profileActionSelected$ = this.profileActionSelectedSubject.asObservable();
+
+  /**
+   * Update avatar configuration
+   */
+  setAvatarInitials(initials: string) {
+    this._avatarInitials.set(initials);
+  }
+
+  setAvatarType(type: 'initials' | 'photo' | 'icon') {
+    this._avatarType.set(type);
+  }
+
+  setAvatarSrc(src: string) {
+    this._avatarSrc.set(src);
+  }
+
+  /**
+   * Set profile menu items globally.
+   * This will be used by both ds-mobile-tab-bar and ds-mobile-page-main
+   * if they don't receive profileMenuItems as an input.
+   */
+  setProfileMenuItems(items: ActionGroup[]) {
+    this._profileMenuItems.set(items);
+  }
+
+  /**
+   * Notify subscribers that a profile action was selected
+   */
+  notifyProfileAction(result: ActionResult) {
+    this.profileActionSelectedSubject.next(result);
+  }
+}