From 93eabec904e772d7a0b58a3b2a6dd720fc59046d Mon Sep 17 00:00:00 2001
From: samuel161415 <samuelnegalign1@gmail.com>
Date: Fri, 31 May 2024 17:03:25 +0300
Subject: [PATCH] sami.fix : fixing the registration issue and adding the team
 format and then mixing with chat bot and eligiblity

---
 src/app/app.component.html                    | 52 +++++++++++--------
 .../components/landing/landing.component.html | 46 +++++++++-------
 .../components/landing/landing.component.ts   | 17 ++++++
 .../eligibility/eligibility.component.html    |  6 +--
 src/app/pages/home/home.component.html        |  4 +-
 src/app/shared/bot/bot.component.ts           | 24 ++++++++-
 src/app/shared/chat-service.service.ts        |  9 ++--
 7 files changed, 108 insertions(+), 50 deletions(-)

diff --git a/src/app/app.component.html b/src/app/app.component.html
index 2f208b6..02969e9 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,34 +1,41 @@
-
 <!-- <app-privacy-consent></app-privacy-consent> -->
 
 <app-consent></app-consent>
 <ng-container *ngIf="isModalOpen">
   <div
-    class="fixed  top-0 left-0 z-50   w-full mt-5  pt-3  flex flex-col justify-end"
+    class="fixed top-0 left-0 z-50 w-full mt-5 pt-3 flex flex-col justify-end"
   >
     <div class="modal-overlay"></div>
     <div
-      class="border border-gray-600   modal-box w-11/12 max-sm:w-full max-sm:mx-2 max-w-5xl bg-gray-900 text-center flex flex-col mt-4  shadow-lg m-auto"
+      class="border border-gray-600 modal-box w-11/12 max-sm:w-full max-sm:mx-2 max-w-5xl bg-gray-900 text-center flex flex-col mt-4 shadow-lg m-auto"
     >
-      <app-what-we-provide ></app-what-we-provide>
+      <app-what-we-provide></app-what-we-provide>
     </div>
   </div>
 </ng-container>
 <div *ngIf="!modalOpen" class="relative z-41">
   <app-header [currentSection]="currentSection"></app-header>
 </div>
-<div *ngIf="isWinnerModalOpen" class="fixed h-full w-full border-red-500    pt-2  z-50">
+<div
+  *ngIf="isWinnerModalOpen"
+  class="fixed h-full w-full border-red-500 pt-2 z-50"
+>
   <app-winner_modal
-  [showModal]="isModalOpen"
-  [modalData]="modalData"
-  (closeModalEvent)="closeModal()"
-></app-winner_modal>
+    [showModal]="isModalOpen"
+    [modalData]="modalData"
+    (closeModalEvent)="closeModal()"
+  ></app-winner_modal>
 </div>
-
-<div *ngIf="showPartnerButton" style="position: fixed; top: 45vh; left: -40px; z-index: 1000">
-  <a href="https://form.typeform.com/to/opvWnrn7" target="_blank" (click)="openButton('partner', 'https://form.typeform.com/to/opvWnrn7')">
+<div
+  *ngIf="showPartnerButton"
+  style="position: fixed; top: 45vh; left: -40px; z-index: 1000"
+>
+  <a
+    href="https://form.typeform.com/to/opvWnrn7"
+    target="_blank"
+    (click)="openButton('partner', 'https://form.typeform.com/to/opvWnrn7')"
+  >
     <button
-    
       class="px-4 py-3 rounded-md transition-transform duration-300 ease-in-out bg-gradient-to-r from-indigo-600 to-pink-500"
       style="transform: rotate(270deg)"
     >
@@ -45,7 +52,9 @@
   <app-info></app-info>
 </div>
 
-
+<div id="eligibility" class="relative z-40">
+  <app-eligibility (openChatEvent)="openChat()"></app-eligibility>
+</div>
 <div id="home" class="relative z-40">
   <app-home (toggleChatEvent)="changeChatState($event)"></app-home>
 </div>
@@ -63,13 +72,10 @@
   <app-workshop></app-workshop>
 </div> -->
 
-
 <!-- <div id="judges" class="relative z-40">
   <app-judges></app-judges>
 </div> -->
-<!-- <div id="eligibility" class="relative z-40">
-  <app-eligibility (openChatEvent)="openChat()"></app-eligibility>
-</div> -->
+
 <div id="about-us" class="relative z-40">
   <app-about-us></app-about-us>
 </div>
@@ -95,7 +101,9 @@
 <div id="footer" class="relative z-40">
   <app-footer></app-footer>
 </div>
-<!-- <div
+
+
+ <div
   *ngIf="!modalOpen"
   class="fixed {{
     showChat ? 'h-5/6 w-1/3' : 'h-auto w-auto'
@@ -122,13 +130,13 @@
         d="M312.54 415.38a165.32 165.32 0 01-23.26 2.05c-42.43 0-82.5-11.2-115-32.2a184.09 184.09 0 01-53.09-49.32c-26.08-34.57-40.3-78.51-40.3-124.49 0-3.13.11-6.14.22-9.16a4.34 4.34 0 00-7.54-3.12 158.76 158.76 0 00-14.86 195.24c2.47 3.77 3.87 6.68 3.44 8.62l-14.09 72.26a4 4 0 005.22 4.53l68-24.24a16.85 16.85 0 0112.92.22c20.35 8 42.86 12.92 65.37 12.92a169.45 169.45 0 00116.63-46 4.29 4.29 0 00-3.66-7.31z"
       />
     </svg>
-    <!-- <img
+     <!-- <img
       *ngIf="!showChat"
       src="assets/mingcute_message-4-fill.svg"
       alt="..."
       class="w-8 h-8"
-    /> -->
-     <!--<svg
+    />  -->
+<svg
       *ngIf="showChat"
       xmlns="http://www.w3.org/2000/svg"
       fill="none"
diff --git a/src/app/components/landing/landing.component.html b/src/app/components/landing/landing.component.html
index 98cf75a..bef7dd3 100644
--- a/src/app/components/landing/landing.component.html
+++ b/src/app/components/landing/landing.component.html
@@ -1,6 +1,17 @@
-<div id="landing" class="min-h-screen pt-[0px] lg:pt-[0px] bg-blue-950 bg-opacity-50 relative">
-  <video autoplay [muted]="isMuted" loop class="w-full h-full object-cover absolute z-0">
-    <source src="https://res.cloudinary.com/eskalate/video/upload/v1716272816/Hackathon/Hackathon_2023_Highlights_RAW_V1.mp4" type="video/mp4">
+<div
+  id="landing"
+  class="min-h-screen pt-[0px] lg:pt-[0px] bg-blue-950 bg-opacity-50 relative"
+>
+  <video
+    autoplay
+    [muted]="isMuted"
+    loop
+    class="w-full h-full object-cover absolute z-0"
+  >
+    <source
+      src="https://res.cloudinary.com/eskalate/video/upload/v1716272816/Hackathon/Hackathon_2023_Highlights_RAW_V1.mp4"
+      type="video/mp4"
+    />
     Your browser does not support the video tag.
   </video>
   <app-registration [comingName]="individualName" [showModal]="showIndividualRegistrationModal" [registrationLink]="indivisualRegistrationLink" (closeModalEvent)="onHideModal()"></app-registration>
@@ -11,15 +22,16 @@
   <div
     class=" h-[100vh] lg:pt-[18vh] px:5 md:px-20 flex flex-col max-lg:justify-center justify-start items-start  z-1 relative drop-shadow-2xl bg-black bg-opacity-50"
   >
- 
-    <div class=" text-white px-5">
-      <section  class=" left col-span-2  p-5 md:h-full flex flex-col items-center md:items-start justify-between ">
+    <div class="text-white px-5">
+      <section
+        class="left col-span-2 p-5 md:h-full flex flex-col items-center md:items-start justify-between"
+      >
         <div
           class="w-full flex flex-col max-md:items-center items-start leading-relaxed mb-5"
         >
           <!-- A2SV Hackathon, 2023 -->
           <h1
-            class=" text-left w-full max-md:text-center text-xl font-bold md:text-3xl lg:text-5xl"
+            class="text-left w-full max-md:text-center text-xl font-bold md:text-3xl lg:text-5xl"
           >
             A2SV Hackathon, 20244
           </h1>
@@ -30,10 +42,13 @@
           </h1>
         </div>
 
-        <h2><app-count-down class="inline-block pl-0 max-md:text-center"></app-count-down></h2>
+        <h2>
+          <app-count-down
+            class="inline-block pl-0 max-md:text-center"
+          ></app-count-down>
+        </h2>
 
-         
-          <div
+        <div
           class="max-md:mt-8 flex flex-col md:flex-row justify-center max-md:items-center md:justify-start mt-3"
         >
         
@@ -74,12 +89,9 @@ <h2><app-count-down class="inline-block pl-0 max-md:text-center"></app-count-dow
         
           
         </div>
-          
-      
-        
       </section>
       <!-- <section class="right col-span-1 md:col-span-6  md:h-full md:px-5 mb-10 "> -->
-        <!-- <p class="my-4 tracking-tight leading-a.5 text-justify justify-between">
+      <!-- <p class="my-4 tracking-tight leading-a.5 text-justify justify-between">
           Join Africa’s largest Hackathon in 2024, focused on creating social
           and economic solutions with AI. This is the largest hackathon in
           Africa, connecting students, mentors, and industry leaders to develop
@@ -91,10 +103,8 @@ <h2><app-count-down class="inline-block pl-0 max-md:text-center"></app-count-dow
           Take this chance to contribute, collaborate, and make a real
           difference. Be part of moving AI forward in Africa.
         </p> -->
-        <!-- <p></p> -->
-        
-        
-        
+      <!-- <p></p> -->
+
       <!-- </section> -->
     </div>
     <!-- <div class="mx-[10] w-full overflow-hidden">
diff --git a/src/app/components/landing/landing.component.ts b/src/app/components/landing/landing.component.ts
index 1a0fe36..a37ae20 100644
--- a/src/app/components/landing/landing.component.ts
+++ b/src/app/components/landing/landing.component.ts
@@ -19,6 +19,23 @@ export class LandingComponent {
     
   ];
   isMuted=true;
+  // showChat = false;
+  // showMentorsModal = false;
+  // showAdvisorsModal = false;
+  // mentorsRegistrationLink = 'https://form.typeform.com/to/UvayCDEJ';
+  // advisorsRegistrationLink = 'https://form.typeform.com/to/mMzeQ63l';
+  // showGetInvolvedModal = true;
+  // showTeamRegistrationModal = false;
+  // showIndividualRegistrationModal = false;
+  // showRegistrationModal = false;
+  // currentSection: string = 'home';
+  // registrationDeadline = new Date(2024, 5, 31, 23, 59, 59);
+  // registrationButtonVisible = false;
+  // countDownVisible = false;
+  // countDownDate = new Date('2024-5-15T20:59:00');
+  // animated: boolean = false;
+  // @Output() toggleChatEvent = new EventEmitter<boolean>();
+
   slickConfig = {
     slidesToShow: 3,
     slidesToScroll: 3,
diff --git a/src/app/pages/eligibility/eligibility.component.html b/src/app/pages/eligibility/eligibility.component.html
index e20ceb3..b400a29 100644
--- a/src/app/pages/eligibility/eligibility.component.html
+++ b/src/app/pages/eligibility/eligibility.component.html
@@ -1,7 +1,7 @@
 <section id="eligibility" class=" max-sm:px-4 max-lg:px-12 sm:pb-16 pt-24 pb-32 px-20 overflow-x-hidden">
   <h2 class="sm:text-4xl text-center text-2xl font-medium  mb-4 text-white">Eligibility</h2>
-  <div class="flex flex-col lg:flex-row gap-x-12   items-center">
-    <div  class="lg:w-1/2 flex-none max-lg:my-6 sm:pb-8 md:mx-8 sm:mt-0   sm:text-left">
+  <div class=" p-2 grid grid-cols-1 lg:grid-cols-2 gap-x-12   items-center">
+    <div  class="  flex-none max-lg:my-6 sm:pb-8 md:mx-8 sm:mt-0   sm:text-left">
       <p class=" text-gray-300 leading-relaxed max-sm:text-start  ">The hackathon is open to all students located in Africa who are passionate about generative technology and eager to showcase their skills and creativity. To participate, you must meet the following eligibility requirements:</p>
        <ul>
         <li *ngFor="let criteria of criterieas">
@@ -18,6 +18,6 @@ <h2 class="sm:text-4xl text-center text-2xl font-medium  mb-4 text-white">Eligib
         <button onClick="register_modal.showModal()"  class="inline-flex disabled:bg-gray-500  text-black bg-white border-0 max-sm:px-4 py-2 px-6 focus:outline-none hover:drop-shadow-xl  hover:bg-gray-300 rounded max-sm:text-sm text-lg">Register Now</button>
       </div>
     </div>
-    <img src="assets/chat%20image.png" class="lg:w-1/2 flex-none max-md:hidden  w-full object-fill object-center rounded-3xl" alt="">
+    <img src="assets/chat%20image.png" class="  flex-none max-md:hidden  w-full object-cover object-center rounded-3xl" alt="">
   </div>
 </section>
diff --git a/src/app/pages/home/home.component.html b/src/app/pages/home/home.component.html
index 18ff1a8..ebdf8d2 100644
--- a/src/app/pages/home/home.component.html
+++ b/src/app/pages/home/home.component.html
@@ -186,8 +186,8 @@ <h1 class="w-full text-center flex flex-row justify-start items-center mb-2"><sp
                 class="inline-flex disabled:bg-gray-500 text-black bg-white border-0 max-sm:px-4 py-2 px-6 focus:outline-none hover:drop-shadow-xl hover:bg-gray-300 rounded max-sm:text-sm text-lg"
               >
                 Register Now
-              </button> -->
-              <!-- <dialog
+              </button>
+              <dialog
                 *ngIf="showRegistrationModal"
                 id="register_modal"
                 class="modal mt-4"
diff --git a/src/app/shared/bot/bot.component.ts b/src/app/shared/bot/bot.component.ts
index 3aba9ed..755196c 100644
--- a/src/app/shared/bot/bot.component.ts
+++ b/src/app/shared/bot/bot.component.ts
@@ -4,6 +4,7 @@ import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/
 import {NgForOf, NgIf} from "@angular/common";
 import {LocalStorageService} from "../local-storage.service";
 import {takeUntil} from "rxjs";
+import { IpService } from '../ip.service';
 
 export interface Message{
   role: string,
@@ -15,7 +16,7 @@ export interface Message{
   styleUrls: ['./bot.component.css'],
 })
 export class BotComponent {
-  constructor( private chatService: ChatService, private localStorageService: LocalStorageService) {
+  constructor(private ipService: IpService, private chatService: ChatService, private localStorageService: LocalStorageService) {
     this.localStorageService.seedData()
     this.localStorageService._waitingResponse$.subscribe((waitingStatus)=>{
       this.isChatLoading = waitingStatus
@@ -24,12 +25,28 @@ export class BotComponent {
       this.messages = messages
     })
   }
+  ngOnInit() {
+    this.fetchIpAddress();
+  }
+
+  fetchIpAddress() {
+    this.ipService.getIpAddress().subscribe(
+      (response: any) => {
+        this.ipAddress = response.ip;
+        console.log('IP Address:', this.ipAddress); // Debug log
+      },
+      (error) => {
+        console.error('Failed to fetch IP address:', error);
+      }
+    );
+  }
 
   isChatLoading: boolean = false;
   messages: Message[] = [];
   chatForm = new FormGroup({
     message: new FormControl('', [Validators.required])
   })
+  ipAddress: string = '';
 
   @Output() closeChatEvent = new EventEmitter<void>()
   @ViewChild('scrollableContainer') private scrollableContainer: ElementRef | undefined;
@@ -46,9 +63,12 @@ export class BotComponent {
       content: this.chatForm.value.message!
     })
     this.localStorageService.setWaitingStatus( true )
+
+    const messageContent = this.chatForm.value.message!;
     try{
-      this.chatService.sendMessage( this.chatForm.value.message! ).subscribe((response:any)=>{
+      this.chatService.sendMessage( messageContent,this.ipAddress ).subscribe((response:any)=>{
         // console.log(response)
+        console.log("Response: ", response);
         this.isChatLoading = false;
         this.localStorageService.setWaitingStatus( false )
         this.localStorageService.addMessage({
diff --git a/src/app/shared/chat-service.service.ts b/src/app/shared/chat-service.service.ts
index 1bc43da..65c352f 100644
--- a/src/app/shared/chat-service.service.ts
+++ b/src/app/shared/chat-service.service.ts
@@ -12,12 +12,15 @@ export class ChatService {
     private httpClient: HttpClient
   ) { }
 
-  sendMessage(message: string){
+  sendMessage(message: string, ipAddress: string){
     // console.log("message ", message)
+    console.log("Sending message: ", message);
+    console.log("Sending ipAddress: ", ipAddress);
 
     return this.httpClient.post(
-      'https://ifoki-lylswf275a-ew.a.run.app/api/chat',
-      {prompt: message},
+      // 'https://ifoki-lylswf275a-ew.a.run.app/api/chat',
+      ' https://a2sv-generative-ai-hackathon-lylswf275a-zf.a.run.app/api/v1',
+      { ip_address: ipAddress, query: message },
     ).pipe(
       catchError(error => {
         if (error.error instanceof ErrorEvent) {