style: public event page right column

apps/commudle-admin/src/app/feature-modules/public-events/components/event-registration-form/event-registration-form.component.html

@@ -0,0 +1,16 @@
+<div *ngIf="openForm">
+  <div class="open-forms">
+    <a
+      [routerLink]="['/fill-form', openForm.data_form_entity_id]"
+      nbButton
+      nbTooltip="{{ openForm.name }}"
+      size="small"
+      status="primary"
+    >
+      <nb-icon *ngIf="!openForm.already_filled" icon="people"></nb-icon>
+      <nb-icon *ngIf="openForm.already_filled" class="edit-icon" icon="edit"></nb-icon>
+
+      {{ openForm.name }}
+    </a>
+  </div>
+</div>

apps/commudle-admin/src/app/feature-modules/public-events/components/event-registration-form/event-registration-form.component.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { EventRegistrationFormComponent } from './event-registration-form.component';
+
+describe('EventRegistrationFormComponent', () => {
+  let component: EventRegistrationFormComponent;
+  let fixture: ComponentFixture<EventRegistrationFormComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [EventRegistrationFormComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(EventRegistrationFormComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

apps/commudle-admin/src/app/feature-modules/public-events/components/event-registration-form/event-registration-form.component.ts

@@ -0,0 +1,38 @@
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { ICommunity } from 'apps/shared-models/community.model';
+import { IEvent } from 'apps/shared-models/event.model';
+import { EventDataFormEntityGroupsService } from 'apps/commudle-admin/src/app/services/event-data-form-entity-groups.service';
+import { IEventDataFormEntityGroup } from 'apps/shared-models/event_data_form_enity_group.model';
+import { ERegistationTypes } from 'apps/shared-models/enums/registration_types.enum';
+
+@Component({
+  selector: 'commudle-event-registration-form',
+  templateUrl: './event-registration-form.component.html',
+  styleUrls: ['./event-registration-form.component.scss'],
+})
+export class EventRegistrationFormComponent implements OnInit {
+  @Input() community: ICommunity;
+  @Input() event: IEvent;
+  @Output() hasRegistrationForm = new EventEmitter();
+
+  openForm: IEventDataFormEntityGroup;
+
+  constructor(private eventDataFormEntityGroupsService: EventDataFormEntityGroupsService) {}
+
+  ngOnInit(): void {
+    this.getRegistrationForm();
+  }
+
+  getRegistrationForm() {
+    if (this.event.editable) {
+      this.eventDataFormEntityGroupsService.pGetPublicOpenDataForms(this.event.id).subscribe((data) => {
+        this.openForm = data.event_data_form_entity_groups.find(
+          (form) => form.registration_type.name === ERegistationTypes.ATTENDEE,
+        );
+        if (this.openForm) {
+          this.hasRegistrationForm.emit(true);
+        }
+      });
+    }
+  }
+}

apps/commudle-admin/src/app/feature-modules/public-events/components/home-event/home-event.component.html

@@ -159,7 +159,7 @@ <h6>
               View attended members
             </button>
             <div *ngIf="moment() < moment(event.end_time)" class="registrations-buttons">
-              <div class="registration-form">
+              <div class="forms">
                 <app-highlighted-links
                   (hasOpenForms)="hasOpenForms = $event"
                   *ngIf="event.editable || event.event_status.name === EEventStatuses.OPEN"
@@ -168,8 +168,19 @@ <h6>
                 ></app-highlighted-links>
               </div>
             </div>
+            <!-- <div class="registration-form">
+                <commudle-event-registration-form></commudle-event-registration-form>
+              </div> -->
           </nb-card-body>
         </nb-card>
+        <div class="registration-form">
+          <commudle-event-registration-form
+            (hasRegistrationForm)="hasRegistrationForm = $event"
+            *ngIf="event.editable || event.event_status.name === EEventStatuses.OPEN"
+            [community]="community"
+            [event]="event"
+          ></commudle-event-registration-form>
+        </div>
         <nb-card *ngIf="moment() >= moment(event.end_time) && !event.custom_agenda">
           <nb-card-body>
             <p class="text-info">

apps/commudle-admin/src/app/feature-modules/public-events/components/home-event/home-event.component.scss

@@ -79,7 +79,7 @@
 
         .registrations-buttons {
           @apply com-p-0 com-border-0 com-border-b com-border-solid com-border-Bright-Gray;
-          .registration-form {
+          .forms {
             @apply com-mb-4;
           }
         }
@@ -88,6 +88,10 @@
       app-messages {
         @apply com-block com-h-96;
       }
+
+      .registration-form {
+        @apply md:com-hidden com-flex com-sticky com-top-12;
+      }
     }
   }
 }

apps/commudle-admin/src/app/feature-modules/public-events/components/home-event/home-event.component.ts

@@ -32,6 +32,7 @@ export class HomeEventComponent implements OnInit, OnDestroy {
   hasCollaborationCommunities = false;
   hasVolunteers = false;
   hasOpenForms = false;
+  hasRegistrationForm;
   hasInterestedMembers = false;
   hasSponsors = false;
 

apps/commudle-admin/src/app/feature-modules/public-events/public-events.module.ts

@@ -53,6 +53,7 @@ import { SkeletonCardsComponent } from 'apps/commudle-admin/src/app/feature-modu
 import { PublicHomeListEventsModule } from 'apps/commudle-admin/src/app/feature-modules/listing-pages/public-home-list-events/public-home-list-events.module';
 import { PublicHomeListSpeakersModule } from 'apps/commudle-admin/src/app/feature-modules/listing-pages/public-home-list-speakers/public-home-list-speakers.module';
 import { EventsAgendaComponent } from './components/events-agenda/events-agenda.component';
+import { EventRegistrationFormComponent } from './components/event-registration-form/event-registration-form.component';
 
 @NgModule({
   declarations: [
@@ -79,6 +80,7 @@ import { EventsAgendaComponent } from './components/events-agenda/events-agenda.
     AttendedMembersComponent,
     AttendedMembersCardComponent,
     EventsAgendaComponent,
+    EventRegistrationFormComponent,
   ],
   imports: [
     CommonModule,