Merge branch 'refactor-admin-community-sidebar' of https://github.com…

…/Prerna290/commudle-ng into refactor-admin-community-sidebar
commudle · Jan 3, 2025 · ce00aad · ce00aad
2 parents 656f1ea + fff8e37
commit ce00aad
Show file tree

Hide file tree

Showing 12 changed files with 63 additions and 31 deletions.
diff --git a/...mudle-admin/src/app/components/communities/communities-list/communities-list.component.ts b/...mudle-admin/src/app/components/communities/communities-list/communities-list.component.ts
@@ -91,9 +91,7 @@ export class CommunitiesListComponent implements OnInit, OnDestroy {
   }
 
   updateSeoTitle() {
-    this.seoTitle = this.query
-      ? `${this.query} - Join Leading Developer Communities`
-      : 'Join Leading Developer Communities';
+    this.seoTitle = this.query ? `${this.query} - Developer Communities` : 'Developer Communities';
 
     this.seoService.setTags(
       this.seoTitle,

diff --git a/...ity-control-panel/components/community-edit-details/community-edit-details.component.html b/...ity-control-panel/components/community-edit-details/community-edit-details.component.html
@@ -184,6 +184,15 @@
         </div>
       </div>
 
+      <div role="group">
+        <div>
+          <label>
+            Instagram
+            <input formControlName="instagram" fullWidth nbInput type="text" />
+          </label>
+        </div>
+      </div>
+
       <div role="group">
         <div>
           <label fullWidth>

diff --git a/...unity-control-panel/components/community-edit-details/community-edit-details.component.ts b/...unity-control-panel/components/community-edit-details/community-edit-details.component.ts
@@ -80,6 +80,7 @@ export class CommunityEditDetailsComponent implements OnInit {
         github: [''],
         website: [''],
         linkedin: [''],
+        instagram: [''],
         location: ['', Validators.required],
       }),
     });

diff --git a/.../feature-modules/public-community/components/home-community/home-community.component.html b/.../feature-modules/public-community/components/home-community/home-community.component.html
@@ -24,7 +24,7 @@
                 <img
                   alt="{{ community.name }}"
                   class="logo"
-                  src="{{ community.logo_image_path.i64 }}"
+                  src="{{ community.logo_image_path?.i64 }}"
                   title="{{ community.name }}"
                 />
                 <app-share-button
@@ -78,6 +78,14 @@ <h1 class="com-text-Yankees-Blue">{{ community.name }}</h1>
                     >
                       <nb-icon icon="linkedin" status="info"></nb-icon>
                     </a>
+                    <a
+                      *ngIf="community.instagram"
+                      href="{{ community.instagram | completeurl : 'instagram' }}"
+                      rel="noreferrer"
+                      target="_blank"
+                    >
+                      <fa-icon [icon]="faInstagram"></fa-icon>
+                    </a>
                     <a
                       *ngIf="community.twitter"
                       href="{{ community.twitter | completeurl : 'twitter' }}"
@@ -133,7 +141,7 @@ <h1 class="com-text-Yankees-Blue">{{ community.name }}</h1>
                 <div class="mini-logo-section">
                   <img
                     alt="{{ community.name }}"
-                    src="{{ community.logo_image_path.i64 }}"
+                    src="{{ community.logo_image_path?.i64 }}"
                     title="{{ community.name }}"
                     class="mini-logo"
                   />

diff --git a/.../feature-modules/public-community/components/home-community/home-community.component.scss b/.../feature-modules/public-community/components/home-community/home-community.component.scss
@@ -60,6 +60,10 @@
             @apply com-text-Very-Light-Blue;
           }
 
+          fa-icon {
+            @apply com-text-xl;
+          }
+
           a {
             @apply com-no-underline;
           }

diff --git a/...pp/feature-modules/public-community/components/home-community/home-community.component.ts b/...pp/feature-modules/public-community/components/home-community/home-community.component.ts
@@ -16,6 +16,7 @@ import { faCaretDown, faMessage, faNewspaper } from '@fortawesome/free-solid-svg
 import { NewsletterService } from 'apps/commudle-admin/src/app/services/newsletter.service';
 import { DarkModeService } from 'apps/commudle-admin/src/app/services/dark-mode.service';
 import { EDbModels } from '@commudle/shared-models';
+import { faInstagram } from '@fortawesome/free-brands-svg-icons';
 
 interface CustomMenuItem {
   title: string;
@@ -42,6 +43,7 @@ export class HomeCommunityComponent implements OnInit, OnDestroy {
   faCaretDown = faCaretDown;
   faMessage = faMessage;
   faNewspaper = faNewspaper;
+  faInstagram = faInstagram;
 
   items = [{ title: 'pages', slug: 'pages' }];
 

diff --git a/...r-extra-details/user-contributions/user-community-card/user-community-card.component.html b/...r-extra-details/user-contributions/user-community-card/user-community-card.component.html
@@ -1,19 +1,19 @@
 <nb-card
   [routerLink]="['/communities', community.community.slug]"
   class="user-communities-card"
-  [ngClass]="{ organizer: community.user_role.name == 'organizer' }"
+  [ngClass]="{ organizer: community.user_role.name === 'organizer' }"
 >
   <nb-card-body>
     <img
       [alt]="community.community.name"
-      [src]="community.community.logo_image_path.i64"
+      [src]="community.community.logo_image_path?.i64"
       [title]="community.community.name"
       class="user-communities-logo"
     />
     <div class="com-flex com-flex-col">
       <h4 class="user-communities-name">{{ community.community.name }}</h4>
       <p class="user-communities-role">
-        <nb-icon icon="star" *ngIf="community.user_role.name == 'organizer'"></nb-icon>
+        <nb-icon icon="star" *ngIf="community.user_role.name === 'organizer'"></nb-icon>
         <span>
           {{ community.user_role.name | titlecase }}
         </span>

diff --git a/...ts/public-profile/user-extra-details/user-contributions/user-contributions.component.html b/...ts/public-profile/user-extra-details/user-contributions/user-contributions.component.html
@@ -59,21 +59,24 @@
   <nb-card-header>
     <fa-icon [icon]="faUsers" class="com-text-Chrome-Yellow"></fa-icon>
     Communities
-    <span *ngIf="communities.length > 4">({{ communities.length }})</span>
+    <span>({{ communitiesTotal }})</span>
   </nb-card-header>
-  <nb-card-body [ngClass]="{ 'view-more': viewMoreCommunitiesSection, 'view-less': !viewMoreCommunitiesSection }">
+  <nb-card-body>
     <div class="grid">
       <app-user-community-card
         *ngFor="let community of communities | sortBy : ['user_role.id'] : ['desc']"
         [community]="community"
       ></app-user-community-card>
     </div>
   </nb-card-body>
-  <nb-card-footer *ngIf="communities?.length > 6" (click)="viewMoreCommunities()" class="com-cursor-pointer">
+  <nb-card-footer
+    (click)="viewMoreCommunities()"
+    class="com-cursor-pointer"
+    *ngIf="communitiesTotal !== communities.length"
+  >
     <div>
       {{ footerCommunitiesCardText }}
-      <nb-icon *ngIf="viewMoreCommunitiesSection" icon="arrow-ios-downward-outline"></nb-icon>
-      <nb-icon *ngIf="!viewMoreCommunitiesSection" icon="arrow-ios-upward-outline"></nb-icon>
+      <nb-icon icon="arrow-ios-downward-outline"></nb-icon>
     </div>
   </nb-card-footer>
 </nb-card>

diff --git a/...ents/public-profile/user-extra-details/user-contributions/user-contributions.component.ts b/...ents/public-profile/user-extra-details/user-contributions/user-contributions.component.ts
@@ -20,14 +20,16 @@ export class UserContributionsComponent implements OnChanges, OnDestroy {
 
   labs: ILab[] = [];
   communities: IUserRolesUser[] = [];
+  communitiesCount = 6;
+  communitiesTotal = 0;
+  communitiesPage = 1;
   builds: ICommunityBuild[] = [];
   attendedEvents: IEvent[] = [];
   pastEvents: IEvent[] = [];
 
   subscriptions: Subscription[] = [];
 
   viewMoreEventsSection = true;
-  viewMoreCommunitiesSection = true;
   footerCommunitiesCardText: string;
   footerEventsCardText: string;
   faLightbulb = faLightbulb;
@@ -63,12 +65,17 @@ export class UserContributionsComponent implements OnChanges, OnDestroy {
 
   getCommunities(): void {
     this.subscriptions.push(
-      this.appUsersService.communities(this.user.username).subscribe((value) => {
-        // TODO: If some community is undefined then remove it, is that required?
-        this.communities = value.user_roles_users.filter((community) => community.community);
-        this.userProfileMenuService.addMenuItem('communities', this.communities.length > 0);
-        this.footerCommunitiesCardText = `View More (${this.communities.length - 6})`;
-      }),
+      this.appUsersService
+        .communities(this.user.username, this.communitiesPage, this.communitiesCount)
+        .subscribe((res) => {
+          // TODO: If some community is undefined then remove it, is that required?
+          this.communities = this.communities.concat(res.values.filter((community) => community.community));
+          this.communitiesTotal = res.total;
+          this.communitiesPage = res.page;
+          this.userProfileMenuService.addMenuItem('communities', res.total > 0);
+          this.footerCommunitiesCardText =
+            res.total <= this.communities.length ? 'View More' : `View More (${res.total - this.communities.length})`;
+        }),
     );
   }
 
@@ -91,12 +98,8 @@ export class UserContributionsComponent implements OnChanges, OnDestroy {
   }
 
   viewMoreCommunities() {
-    this.viewMoreCommunitiesSection = !this.viewMoreCommunitiesSection;
-    if (!this.viewMoreCommunitiesSection) {
-      this.footerCommunitiesCardText = `View Less`;
-    } else {
-      this.footerCommunitiesCardText = `View More (${this.communities.length - 6})`;
-    }
+    this.communitiesPage = this.communitiesPage + 1;
+    this.getCommunities();
   }
 
   getAttendedEvents(): void {

diff --git a/apps/commudle-admin/src/app/services/app-users.service.ts b/apps/commudle-admin/src/app/services/app-users.service.ts
@@ -1,6 +1,6 @@
 import { HttpClient, HttpParams } from '@angular/common/http';
 import { Injectable } from '@angular/core';
-import { IPaginationCount } from '@commudle/shared-models';
+import { IPaginationCount, IUserRolesUser } from '@commudle/shared-models';
 import { IAttachedFile } from 'apps/shared-models/attached-file.model';
 import { IBadges } from 'apps/shared-models/badges.model';
 import { ICommunityBuilds } from 'apps/shared-models/community-builds.model';
@@ -62,9 +62,12 @@ export class AppUsersService {
   }
 
   // get list of communities and role of the user in it
-  communities(username): Observable<IUserRolesUsers> {
-    const params = new HttpParams().set('username', username);
-    return this.http.get<IUserRolesUsers>(this.apiRoutesService.getRoute(API_ROUTES.USERS.COMMUNITIES), { params });
+  communities(username: string, page = 1, count = 6): Observable<IPaginationCount<IUserRolesUser>> {
+    const params = new HttpParams().set('username', username).set('page', page).set('count', count);
+    return this.http.get<IPaginationCount<IUserRolesUser>>(
+      this.apiRoutesService.getRoute(API_ROUTES.USERS.COMMUNITIES),
+      { params },
+    );
   }
 
   // admin panel view of list of labs

diff --git a/apps/shared-components/community-badge/community-badge.component.html b/apps/shared-components/community-badge/community-badge.component.html
@@ -9,7 +9,7 @@
     <div class="logo">
       <img
         alt="{{ community.name }}"
-        src="{{ community.logo_image_path.i64 || community.logo_image?.url || community.logo_image_path?.url }}"
+        src="{{ community.logo_image_path?.i64 || community.logo_image?.url || community.logo_image_path?.url }}"
         title="{{ community.name }}"
       />
     </div>

diff --git a/libs/shared/models/src/lib/community.model.ts b/libs/shared/models/src/lib/community.model.ts
@@ -30,6 +30,7 @@ export interface ICommunity {
   upcoming_events_count: number;
   has_refund_policy: boolean;
   upcoming_hackathons_count: number;
+  instagram: string;
 }
 
 export interface ICommunitySearch extends ICommunity {