pass courseId as query param when navigating from course to program page

Author: Awakich

projects/social_platform/src/app/office/courses/detail/course-detail.component.ts

@@ -77,6 +77,8 @@ export class CourseDetailComponent implements OnInit {
   }
 
   redirectToProgram(): void {
-    this.router.navigateByUrl(`/office/program/${this.course()?.partnerProgramId}`);
+    this.router.navigate([`/office/program/${this.course()?.partnerProgramId}`], {
+      queryParams: { courseId: this.course()?.id },
+    });
   }
 }

projects/social_platform/src/app/office/courses/shared/course/course.component.html

@@ -4,7 +4,6 @@
 <div class="course">
   <div class="course__cover">
     <app-avatar [size]="68" [url]="course.avatarUrl"></app-avatar>
-    <img src="assets\icons\svg\rocket.svg" class="course__rocket" />
     <app-button
       customTypographyClass="text-body-10"
       [color]="isMember() ? 'primary' : isSubs() ? 'red' : 'green'"

projects/social_platform/src/app/office/features/detail/detail.component.html

@@ -181,8 +181,11 @@
               участники
             </app-button>
           </a>
-          } @else { @if (info().courseId) {
-          <a class="info__contacts" [routerLink]="'/office/courses/' + info().courseId">
+          } @else { @if (info().courseId || queryCourseId()) {
+          <a
+            class="info__contacts"
+            [routerLink]="'/office/courses/' + (info().courseId || queryCourseId())"
+          >
             <app-button appearance="outline" size="medium" customTypographyClass="text-body-12">
               перейти в курс
             </app-button>

projects/social_platform/src/app/office/features/detail/detail.component.ts

@@ -80,6 +80,7 @@ export class DeatilComponent implements OnInit, OnDestroy {
   profile?: User;
   profileProjects = signal<User["projects"]>([]);
   listType: "project" | "program" | "profile" = "project";
+  queryCourseId = signal<number | null>(null);
 
   // Переменная для подсказок
   isTooltipVisible = false;
@@ -158,6 +159,12 @@ export class DeatilComponent implements OnInit, OnDestroy {
       this.listType = data["listType"];
     });
 
+    const queryParamsSub$ = this.route.queryParams.subscribe(params => {
+      const courseId = params["courseId"];
+      this.queryCourseId.set(courseId ? +courseId : null);
+    });
+    this.subscriptions.push(queryParamsSub$);
+
     this.initializeBackPath();
 
     this.updatePageStates();