diff --git a/src/app/dashboard/partner-details/partner-details.component.html b/src/app/dashboard/partner-details/partner-details.component.html
index 97b8aa7..5de944b 100644
--- a/src/app/dashboard/partner-details/partner-details.component.html
+++ b/src/app/dashboard/partner-details/partner-details.component.html
@@ -1,4 +1,4 @@
-<section>
+<section *ngIf="partnerDetails">
     <div class="shadow" *ngIf="showExportOptions" (click)="showExportOptions = false"></div>
 
     <section class="subpage">
@@ -7,10 +7,11 @@
         </header>
 
         <div class="segments">
-            <button class="button" [ngClass]="{'active' : selectedSegment === 1}" (click)="selectedSegment = 1"> Profile </button>
-            <button class="button" [ngClass]="{'active' : selectedSegment === 2}" (click)="selectedSegment = 2"  
-            *ngIf="partnerDetails.surveyCtoData.hiiData.length > 0 || partnerDetails.surveyCtoData.spData.length > 0 || partnerDetails.surveyCtoData.spSchemeData.length > 0" 
-            > Implementation Data </button>
+            <button class="button" [ngClass]="{'active' : selectedSegment === 1}" (click)="selectedSegment = 1"> Profile
+            </button>
+            <button class="button" [ngClass]="{'active' : selectedSegment === 2}" (click)="selectedSegment = 2"
+                *ngIf="partnerDetails.surveyCtoData.hiiData.length > 0 || partnerDetails.surveyCtoData.spData.length > 0 || partnerDetails.surveyCtoData.spSchemeData.length > 0">
+                Implementation Data </button>
         </div>
 
         <ng-container *ngIf="selectedSegment === 1">
@@ -21,22 +22,26 @@
 
                 <div class="container">
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.name">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.primaryContact.name">
                         <label> Name </label>
                     </div>
-            
+
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.designation">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.primaryContact.designation">
                         <label> Name </label>
                     </div>
-            
+
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.email">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.primaryContact.email">
                         <label> Name </label>
                     </div>
-                    
+
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.contactNumber">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.primaryContact.contactNumber">
                         <label> Contact </label>
                     </div>
                 </div>
@@ -49,42 +54,51 @@
 
                 <div class="container">
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.name">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.organizationBasicInfo.name">
                         <label> Name </label>
                     </div>
-            
+
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.website">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.organizationBasicInfo.website">
                         <label> Official Website </label>
                     </div>
-            
+
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.type">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.organizationBasicInfo.type">
                         <label> Type </label>
                     </div>
-            
+
                     <div class="input-holder">
-                        <div class="text"> <button *ngFor="let area of partnerDetails.organizationBasicInfo.areasOfWork"> {{ area }} </button> </div>
+                        <div class="text"> <button
+                                *ngFor="let area of partnerDetails.organizationBasicInfo.areasOfWork"> {{ area.name }}
+                            </button> </div>
                         <label> Thematic areas of work </label>
                     </div>
-            
+
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.source">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.organizationBasicInfo.source">
                         <label> How did you hear about us </label>
                     </div>
-            
+
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.referralName">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.organizationBasicInfo.referralName">
                         <label> Name of the organisation and person that referred </label>
                     </div>
 
                     <div class="checkbox-holder">
-                        <input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.wouldLikeUpdates">
+                        <input type="checkbox" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.organizationBasicInfo.wouldLikeUpdates">
                         <label> I would like to receive periodic updates about CAC </label>
                     </div>
 
                     <div class="input-holder">
-                        <textarea type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.reasonForBecomingMember"></textarea>
+                        <textarea type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.organizationBasicInfo.reasonForBecomingMember"></textarea>
                         <label> I would like to become a member of CAC because </label>
                     </div>
                 </div>
@@ -97,20 +111,23 @@
                 </header>
 
                 <div class="container">
-                    
-            
+
+
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.alternateContact.designation">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.alternateContact.designation">
                         <label> Name </label>
                     </div>
-            
+
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.alternateContact.email">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.alternateContact.email">
                         <label> Name </label>
                     </div>
-                    
+
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.alternateContact.contactNumber">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.alternateContact.contactNumber">
                         <label> Contact </label>
                     </div>
                 </div>
@@ -123,28 +140,33 @@
 
                 <div class="container">
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.partnerLocation">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.detailedProfile.partnerLocation">
                         <label> Partner/Organization/Network Headquarters Location </label>
                     </div>
 
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.state">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.detailedProfile.state">
                         <label> State </label>
                     </div>
 
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.district">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.detailedProfile.district">
                         <label> District </label>
                     </div>
 
                     <div class="checkbox-holder">
-                        <input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.haveBranchesInOtherDistricts">
+                        <input type="checkbox" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.detailedProfile.haveBranchesInOtherDistricts">
                         <label> Do you have Branches / Field presence in any other District? </label>
                     </div>
 
                     <div class="input-holder">
                         <div class="text">
-                            <button *ngFor="let country of partnerDetails.detailedProfile.branchLocationCountries"> {{ country }} </button>
+                            <button *ngFor="let country of partnerDetails.detailedProfile.branchLocationCountries"> {{
+                                country }} </button>
                         </div>
                         <label> Branch or Field office Location (Countries) </label>
                     </div>
@@ -158,45 +180,54 @@
 
                     <div class="input-holder">
                         <div class="text">
-                            <button *ngFor="let district of partnerDetails.detailedProfile.districts"> {{ district }} </button>
+                            <button *ngFor="let district of partnerDetails.detailedProfile.districts"> {{ district }}
+                            </button>
                         </div>
                         <label> Branch or Field office Location (Districts) </label>
                     </div>
 
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.yearOfEstablishment">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.detailedProfile.yearOfEstablishment">
                         <label> Which year your organisation/partner/network was established? </label>
                     </div>
 
                     <div class="input-holder">
                         <div class="text">
-                            <button *ngFor="let community of partnerDetails.detailedProfile.communities"> {{ community }} </button>
+                            <button *ngFor="let community of partnerDetails.detailedProfile.communities"> {{ community
+                                }} </button>
                         </div>
                         <label> Which communities do you work with? </label>
                     </div>
 
                     <div class="input-holder">
                         <div class="text">
-                            <button *ngFor="let mode of partnerDetails.detailedProfile.preferredModeOfCommunications"> {{ mode }} </button>
+                            <button *ngFor="let mode of partnerDetails.detailedProfile.preferredModeOfCommunications">
+                                {{ mode.name }} </button>
                         </div>
                         <label> Select your preferred mode of communications with the Collab</label>
                     </div>
 
                     <div class="input-holder">
                         <div class="text">
-                            <button *ngFor="let language of partnerDetails.detailedProfile.preferredLanguages"> {{ language }} </button>
+                            <button *ngFor="let language of partnerDetails.detailedProfile.preferredLanguages"> {{
+                                language.name }} </button>
                         </div>
-                        <label> Preferred Language of Communication* (emails, webinars etc. Select all that apply) </label>
+                        <label> Preferred Language of Communication* (emails, webinars etc. Select all that apply)
+                        </label>
                     </div>
 
                     <div class="input-holder">
-                        <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.totalReachOfOrganization">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.detailedProfile.totalReachOfOrganization">
                         <label> What is the total reach of your organisation in a year? </label>
                     </div>
 
                     <div class="input-holder">
-                        <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.bio"></textarea>
-                        <label> Bio (This information will be displayed along with your logo in the members section of this website. Max:100 Characters) </label>
+                        <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.detailedProfile.bio"></textarea>
+                        <label> Bio (This information will be displayed along with your logo in the members section of
+                            this website. Max:100 Characters) </label>
                     </div>
                 </div>
             </section>
@@ -209,55 +240,70 @@
                 </header>
 
                 <div class="container">
-                <div class="input-holder">
-                    <div class="text">
-                        <button *ngFor="let support of partnerDetails.strengthAndCapability.primaryAreasOfSupportRequired"> {{ support }} </button>
+                    <div class="input-holder">
+                        <div class="text">
+                            <button
+                                *ngFor="let support of partnerDetails.strengthAndCapability.primaryAreasOfSupportRequired">
+                                {{ support.name }} </button>
+                        </div>
+                        <label> What are the primary areas of support that you seek from #COVIDActionCollab? </label>
                     </div>
-                    <label> What are the primary areas of support that you seek from #COVIDActionCollab? </label>
-                </div>
 
-                <div class="input-holder">
-                    <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredOther">
-                    <label> If other, please describe </label>
-                </div>
+                    <div class="input-holder">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredOther">
+                        <label> If other, please describe </label>
+                    </div>
 
-                <div class="input-holder">
-                    <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredDescription"></textarea>
-                    <label> Kindly elaborate on the option(s) selected above </label>
-                </div>
+                    <div class="input-holder">
+                        <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredDescription"></textarea>
+                        <label> Kindly elaborate on the option(s) selected above </label>
+                    </div>
 
-                <div class="input-holder">
-                    <div class="text">
-                        <button *ngFor="let support of partnerDetails.strengthAndCapability.primaryAreasOfSupportOffered"> {{ support }} </button>
+                    <div class="input-holder">
+                        <div class="text">
+                            <button
+                                *ngFor="let support of partnerDetails.strengthAndCapability.primaryAreasOfSupportOffered">
+                                {{ support.name }} </button>
+                        </div>
+                        <label> What are the areas in which you can support/contribute to the #COVIDActionCollab and its
+                            partners? </label>
                     </div>
-                    <label> What are the areas in which you can support/contribute to the #COVIDActionCollab and its partners? </label>
-                </div>
 
-                <div class="input-holder">
-                    <input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedOther">
-                    <label> If other, please describe </label>
-                </div>
+                    <div class="input-holder">
+                        <input type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedOther">
+                        <label> If other, please describe </label>
+                    </div>
 
-                <div class="input-holder">
-                    <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedDescription"></textarea>
-                    <label> Kindly elaborate on the option(s) selected above </label>
-                </div>
+                    <div class="input-holder">
+                        <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedDescription"></textarea>
+                        <label> Kindly elaborate on the option(s) selected above </label>
+                    </div>
 
-                <div class="input-holder">
-                    <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.otherSpecificSupportRequired"></textarea>
-                    <label> Do you require any other specific support? </label>
-                </div>
+                    <div class="input-holder">
+                        <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}"
+                            [(ngModel)]="partnerDetails.strengthAndCapability.otherSpecificSupportRequired"></textarea>
+                        <label> Do you require any other specific support? </label>
+                    </div>
                 </div>
             </section>
 
             <div class="card">
                 <div class="checkbox-holder">
                     <input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.didAgree">
-                    <label>  I agree to the <a href="https://covidactioncollab.org/Mou-charter/" target="_blank">MOU & Charter</a>. </label>
+                    <label> I agree to the <a href="https://covidactioncollab.org/Mou-charter/" target="_blank">MOU &
+                            Charter</a>. </label>
                 </div>
                 <div class="checkbox-holder">
                     <input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.didDeclare">
-                    <label>  I/We hereby declare that I/we neither support nor are associated with any act which promotes: 1. Human trafficking; 2. Smoking / Chewing tobacco; 3. Violence / terrorism 4. Child labour / Child Marriage 5. Discrimination based color, race, religion, caste, disability & sexual orientation 6. Mining 7. Terrorism 8. Abortion counselling referrals, advocate to decriminalise abortion or expand abortion services. </label>
+                    <label> I/We hereby declare that I/we neither support nor are associated with any act which
+                        promotes: 1. Human trafficking; 2. Smoking / Chewing tobacco; 3. Violence / terrorism 4. Child
+                        labour / Child Marriage 5. Discrimination based color, race, religion, caste, disability &
+                        sexual orientation 6. Mining 7. Terrorism 8. Abortion counselling referrals, advocate to
+                        decriminalise abortion or expand abortion services. </label>
                 </div>
             </div>
         </ng-container>
@@ -268,78 +314,78 @@
                     <h5> HII Data </h5>
                 </header>
                 <section class="table" *ngFor="let package of partnerDetails.surveyCtoData.hiiData">
-                        <div class="row">
-                            <div class="col">
-                                Name
-                            </div>
-                            <div class="col">
-                                {{ package.name }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                Implementation Status
-                            </div>
-                            <div class="col">
-                                {{ package.implementationStatus }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                No. of Females
-                            </div>
-                            <div class="col">
-                                {{ package.noOfFemales }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                No. of Males
-                            </div>
-                            <div class="col">
-                                {{ package.noOfMales }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                No. of Transgenders
-                            </div>
-                            <div class="col">
-                                {{ package.noOfTransgender }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                Health Package ID
-                            </div>
-                            <div class="col">
-                                {{ package.packagesHealth }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                Health Remarks
-                            </div>
-                            <div class="col">
-                                {{ package.healthRemarks }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                Disaggregation Note
-                            </div>
-                            <div class="col">
-                                {{ package.disaggregationNote }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                Relevant Documents
-                            </div>
-                            <div class="col">
-                                <a href="{{ package.relevantDocuments }}" target="_blank"> Link </a>
-                            </div>
+                    <div class="row">
+                        <div class="col">
+                            Name
+                        </div>
+                        <div class="col">
+                            {{ package.name }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            Implementation Status
+                        </div>
+                        <div class="col">
+                            {{ package.implementationStatus }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            No. of Females
                         </div>
+                        <div class="col">
+                            {{ package.noOfFemales }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            No. of Males
+                        </div>
+                        <div class="col">
+                            {{ package.noOfMales }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            No. of Transgenders
+                        </div>
+                        <div class="col">
+                            {{ package.noOfTransgender }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            Health Package ID
+                        </div>
+                        <div class="col">
+                            {{ package.packagesHealth }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            Health Remarks
+                        </div>
+                        <div class="col">
+                            {{ package.healthRemarks }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            Disaggregation Note
+                        </div>
+                        <div class="col">
+                            {{ package.disaggregationNote }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            Relevant Documents
+                        </div>
+                        <div class="col">
+                            <a href="{{ package.relevantDocuments }}" target="_blank"> Link </a>
+                        </div>
+                    </div>
                 </section>
             </section>
 
@@ -348,46 +394,46 @@
                     <h5> SP Data </h5>
                 </header>
                 <section class="table" *ngFor="let package of partnerDetails.surveyCtoData.spData">
-                        <div class="row">
-                            <div class="col">
-                                Name
-                            </div>
-                            <div class="col">
-                                {{ package.name }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                Implementation Status
-                            </div>
-                            <div class="col">
-                                {{ package.status }}
-                            </div>
-                        </div> 
-                        <div class="row">
-                            <div class="col">
-                                Total Aggregation
-                            </div>
-                            <div class="col">
-                                {{ package.totalAggregation }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                Other Remarks
-                            </div>
-                            <div class="col">
-                                {{ package.otherRemarks }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                Relevant Documents
-                            </div>
-                            <div class="col">
-                                <a href="{{ package.relevantDocuments }}" target="_blank"> Link </a>
-                            </div>
-                        </div>             
+                    <div class="row">
+                        <div class="col">
+                            Name
+                        </div>
+                        <div class="col">
+                            {{ package.name }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            Implementation Status
+                        </div>
+                        <div class="col">
+                            {{ package.status }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            Total Aggregation
+                        </div>
+                        <div class="col">
+                            {{ package.totalAggregation }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            Other Remarks
+                        </div>
+                        <div class="col">
+                            {{ package.otherRemarks }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            Relevant Documents
+                        </div>
+                        <div class="col">
+                            <a href="{{ package.relevantDocuments }}" target="_blank"> Link </a>
+                        </div>
+                    </div>
                 </section>
             </section>
 
@@ -396,22 +442,22 @@
                     <h5> SP Scheme </h5>
                 </header>
                 <section class="table" *ngFor="let package of partnerDetails.surveyCtoData.spSchemeData">
-                        <div class="row">
-                            <div class="col">
-                                Count
-                            </div>
-                            <div class="col">
-                                {{ package.count }}
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="col">
-                                Scheme Id
-                            </div>
-                            <div class="col">
-                                {{ package.schemeId }}
-                            </div>
-                        </div>                     
+                    <div class="row">
+                        <div class="col">
+                            Count
+                        </div>
+                        <div class="col">
+                            {{ package.count }}
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            Scheme Id
+                        </div>
+                        <div class="col">
+                            {{ package.schemeId }}
+                        </div>
+                    </div>
                 </section>
             </section>
         </ng-container>
@@ -423,10 +469,12 @@
                 <img src="assets/chevron-left.svg" alt="">
                 Back
             </button>
-            
-            <ng-container *ngIf="!isFormEditable" >
-                <button class="button edit" (click)="isFormEditable=true"> <img src="assets/edit.svg" alt=""> Edit </button>
-                <button class="button" (click)="showExportOptions=true"> <img src="assets/export.svg" alt=""> Export </button>        
+
+            <ng-container *ngIf="!isFormEditable">
+                <button class="button edit" (click)="isFormEditable=true"> <img src="assets/edit.svg" alt=""> Edit
+                </button>
+                <button class="button" (click)="showExportOptions=true"> <img src="assets/export.svg" alt=""> Export
+                </button>
                 <button class="button delete"> <img src="assets/delete.svg" alt=""> Delete </button>
             </ng-container>
 
@@ -436,25 +484,28 @@
                     <div class="sub-options">
                         <header>
                             <h5>Select Data Type</h5>
-                        </header> 
+                        </header>
                         <div>
                             <span>Profile Data</span>
-                            <div class="radioButton" [ngClass]="{'active' : isProfileData}" (click) = "isProfileData = true; isImplementationData=false; isBothData=false" ></div>    
+                            <div class="radioButton" [ngClass]="{'active' : isProfileData}"
+                                (click)="isProfileData = true; isImplementationData=false; isBothData=false"></div>
                         </div>
                         <div>
                             <span>Implementation Data</span>
-                            <div class="radioButton" [ngClass]="{'active' : isImplementationData}" (click) = "isImplementationData= true; isProfileData=false; isBothData=false" ></div>    
+                            <div class="radioButton" [ngClass]="{'active' : isImplementationData}"
+                                (click)="isImplementationData= true; isProfileData=false; isBothData=false"></div>
                         </div>
                         <div>
                             <span>Both</span>
-                            <div class="radioButton" [ngClass]="{'active' : isBothData}" (click)="isBothData = true; isProfileData = false; isImplementationData=false"></div>    
+                            <div class="radioButton" [ngClass]="{'active' : isBothData}"
+                                (click)="isBothData = true; isProfileData = false; isImplementationData=false"></div>
                         </div>
                     </div>
 
                     <header>
                         <h5> Export as </h5>
                     </header>
-                    <div class="options">                    
+                    <div class="options">
                         <button class="button" (click)="exportProfileData('CSV')"> CSV </button>
                         <button class="button" (click)="exportProfileData('XLSX')"> Excel </button>
                     </div>
@@ -462,7 +513,8 @@
             </ng-container>
 
             <ng-container *ngIf="isFormEditable">
-                <button class="button edit" (click)="isFormEditable=false"> <img src="assets/save.svg" alt=""> Save </button>
+                <button class="button edit" (click)="isFormEditable=false"> <img src="assets/save.svg" alt=""> Save
+                </button>
                 <button class="button delete" (click)="isFormEditable=false"> X Cancel </button>
             </ng-container>
         </section>
diff --git a/src/app/dashboard/partner-details/partner-details.component.ts b/src/app/dashboard/partner-details/partner-details.component.ts
index 7d07b55..1614094 100644
--- a/src/app/dashboard/partner-details/partner-details.component.ts
+++ b/src/app/dashboard/partner-details/partner-details.component.ts
@@ -1,9 +1,10 @@
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import * as Papa from 'papaparse';
+import { UserData } from 'src/shared/structure/user';
 import * as XLSX from 'xlsx'
 
-type exportType = "CSV" | "XLSX";
+type ExportType = "CSV" | "XLSX";
 
 @Component({
     selector: 'app-partner-details',
@@ -11,7 +12,7 @@ type exportType = "CSV" | "XLSX";
     styleUrls: ['./partner-details.component.scss']
 })
 export class PartnerDetailsComponent implements OnInit {
-    partnerDetails: any;
+    partnerDetails: UserData | undefined;
     isFormEditable: boolean = false;
     selectedSegment: 1 | 2 | 3 = 1;
     showExportOptions: boolean = false;
@@ -30,12 +31,11 @@ export class PartnerDetailsComponent implements OnInit {
     ngOnInit(): void {
         this.activateRouter.queryParams.subscribe((data: any) => {
             this.partnerDetails = JSON.parse(data.data);
-            console.log(this.partnerDetails);
         }).unsubscribe();
     }
 
 
-    loadExportData(partnerData: any) {
+    loadExportData(partnerData: UserData) {
         let exportData: Array<any> = [];
         let exportHiiData: Array<any> = [];
         let exportSpData: Array<any> = [];
@@ -45,123 +45,123 @@ export class PartnerDetailsComponent implements OnInit {
 
 
         exportData = [{
-                "PortalID": partnerData.portalId ? partnerData.portalId : '-',
-
-                // Primary Contact
-
-                "Primary Name": partnerData.primaryContact.name,
-                "Primary Contact Number": partnerData.primaryContact.contactNumber,
-                "Primary Email": partnerData.primaryContact.email,
-                "Primary Designation": partnerData.primaryContact.designation,
-
-                //  Basic Info
-
-                "Areas Of Work": partnerData.organizationBasicInfo.areasOfWork ? partnerData.organizationBasicInfo.areasOfWork.toString() : '',
-                "Name": partnerData.organizationBasicInfo.name,
-                "Reason For Becoming Member": partnerData.organizationBasicInfo.reasonForBecomingMember,
-                "Referral Name": partnerData.organizationBasicInfo.referralName,
-                "Source": partnerData.organizationBasicInfo.source,
-                "Type": partnerData.organizationBasicInfo.type,
-                "Website": partnerData.organizationBasicInfo.website,
-                "Would Like Updates": partnerData.organizationBasicInfo.wouldLikeUpdates,
-
-                // Alternative Contact
-
-                'Alternative Name': partnerData.alternateContact.name,
-                'Alternative ContactNumber': partnerData.alternateContact.contactNumber,
-                'Alternative Email': partnerData.alternateContact.email,
-                'Alternative Designation': partnerData.alternateContact.designation,
-
-                // Detailed Profile
-
-                'Bio': partnerData.detailedProfile.bio,
-                'Branch Location Countries': partnerData.detailedProfile.branchLocationCountries ? partnerData.detailedProfile.branchLocationCountries.toString() : '',
-                "Communities": partnerData.detailedProfile.communities ? partnerData.detailedProfile.communities.toString() : '',
-                "District": partnerData.detailedProfile.district,
-                "Districts": partnerData.detailedProfile.districts ? partnerData.detailedProfile.districts.toString() : '',
-                "Files": partnerData.detailedProfile.files,
-                "Have Branches In Other Districts": partnerData.detailedProfile.haveBranchesInOtherDistricts,
-                "Logo": partnerData.detailedProfile.logo,
-                "partnerData Location": partnerData.detailedProfile.partnerDataLocation,
-                "Preferred Languages": partnerData.detailedProfile.preferredLanguages ? partnerData.detailedProfile.preferredLanguages.toString() : '',
-                "Preferred Mode Of Communications": partnerData.detailedProfile.preferredModeOfCommunications ? partnerData.detailedProfile.preferredModeOfCommunications.toString() : '',
-                "State": partnerData.detailedProfile.state,
-                "States": partnerData.detailedProfile.states ? partnerData.detailedProfile.states.toString() : '',
-                "Total Reach Of Organization": partnerData.detailedProfile.totalReachOfOrganization,
-                "Year Of Establishment": partnerData.detailedProfile.yearOfEstablishment,
-
-                // Strength 
-
-                "Other Specific Support Required": partnerData.strengthAndCapability.otherSpecificSupportRequired,
-                "Primary Areas Of Support Offered": partnerData.strengthAndCapability.otherSpecificSupportRequired ? partnerData.strengthAndCapability.otherSpecificSupportRequired.toString() : '',
-                "Primary Areas Of Support Offered Description": partnerData.strengthAndCapability.primaryAreasOfSupportOffered,
-                "Primary Areas Of Support Offered Other": partnerData.strengthAndCapability.primaryAreasOfSupportOfferedDescription,
-                "Primary Areas Of Support Required": partnerData.strengthAndCapability.primaryAreasOfSupportOfferedOther ? partnerData.strengthAndCapability.primaryAreasOfSupportOfferedOther.toString() : '',
-                "Primary Areas Of Support Required Description": partnerData.strengthAndCapability.primaryAreasOfSupportRequired,
-                "Primary Areas Of Support Required Other": partnerData.strengthAndCapability.primaryAreasOfSupportRequiredOther,
-            }]
-
-
-        
-            let surveyCtoHIIData = [];
-            for (const hiidata of partnerData.surveyCtoData.hiiData) {
-                let partnerHiiDetails = {
-                    "HII Id": hiidata.id,
-                    "HII Name": hiidata.name,
-                    "HII Packages Health": hiidata.packagesHealth,
-                    "HII Implementation Status": hiidata.implementationStatus,
-                    "HII Disaggregation Note": hiidata.disaggregationNote,
-                    "HII No Of Males": hiidata.id,
-                    "HII No Of Females": hiidata.noOfMales,
-                    "HII No Of Transgender": hiidata.noOfTransgender,
-                    "HII Health Remarks": hiidata.healthRemarks,
-                    "HII Relevant Documents": hiidata.relevantDocuments,
-                }
-                surveyCtoHIIData.push(partnerHiiDetails)
+            "PortalID": partnerData.portalId ? partnerData.portalId : '-',
+
+            // Primary Contact
+
+            "Primary Name": partnerData.primaryContact.name,
+            "Primary Contact Number": partnerData.primaryContact.contactNumber,
+            "Primary Email": partnerData.primaryContact.email,
+            "Primary Designation": partnerData.primaryContact.designation,
+
+            //  Basic Info
+
+            "Areas Of Work": partnerData.organizationBasicInfo.areasOfWork ? partnerData.organizationBasicInfo.areasOfWork.map(option => option.name).join(', ') : '',
+            "Name": partnerData.organizationBasicInfo.name,
+            "Reason For Becoming Member": partnerData.organizationBasicInfo.reasonForBecomingMember,
+            "Referral Name": partnerData.organizationBasicInfo.referralName,
+            "Source": partnerData.organizationBasicInfo.source,
+            "Type": partnerData.organizationBasicInfo.type,
+            "Website": partnerData.organizationBasicInfo.website,
+            "Would Like Updates": partnerData.organizationBasicInfo.wouldLikeUpdates,
+
+            // Alternative Contact
+
+            'Alternative Name': partnerData.alternateContact.name,
+            'Alternative ContactNumber': partnerData.alternateContact.contactNumber,
+            'Alternative Email': partnerData.alternateContact.email,
+            'Alternative Designation': partnerData.alternateContact.designation,
+
+            // Detailed Profile
+
+            'Bio': partnerData.detailedProfile.bio,
+            'Branch Location Countries': partnerData.detailedProfile.branchLocationCountries ? partnerData.detailedProfile.branchLocationCountries.map(option => option.name).join(', ') : '',
+            "Communities": partnerData.detailedProfile.communities ? partnerData.detailedProfile.communities.map(option => option.name).join(', ') : '',
+            "District": partnerData.detailedProfile.district,
+            "Districts": partnerData.detailedProfile.districts ? partnerData.detailedProfile.districts.map(option => option.name).join(', ') : '',
+            "Files": partnerData.detailedProfile.files,
+            "Have Branches In Other Districts": partnerData.detailedProfile.haveBranchesInOtherDistricts,
+            "Logo": partnerData.detailedProfile.logo,
+            "partnerData Location": partnerData.detailedProfile.partnerLocation,
+            "Preferred Languages": partnerData.detailedProfile.preferredLanguages ? partnerData.detailedProfile.preferredLanguages.map(option => option.name).join(', ') : '',
+            "Preferred Mode Of Communications": partnerData.detailedProfile.preferredModeOfCommunications ? partnerData.detailedProfile.preferredModeOfCommunications.map(option => option.name).join(', ') : '',
+            "State": partnerData.detailedProfile.state,
+            "States": partnerData.detailedProfile.states ? partnerData.detailedProfile.states.map(option => option.name).join(', ') : '',
+            "Total Reach Of Organization": partnerData.detailedProfile.totalReachOfOrganization,
+            "Year Of Establishment": partnerData.detailedProfile.yearOfEstablishment,
+
+            // Strength 
+
+            "Other Specific Support Required": partnerData.strengthAndCapability.otherSpecificSupportRequired,
+            "Primary Areas Of Support Offered": partnerData.strengthAndCapability.otherSpecificSupportRequired ? partnerData.strengthAndCapability.otherSpecificSupportRequired.toString() : '',
+            "Primary Areas Of Support Offered Description": partnerData.strengthAndCapability.primaryAreasOfSupportOffered.map(option => option.name).join(', '),
+            "Primary Areas Of Support Offered Other": partnerData.strengthAndCapability.primaryAreasOfSupportOfferedDescription,
+            "Primary Areas Of Support Required": partnerData.strengthAndCapability.primaryAreasOfSupportOfferedOther ? partnerData.strengthAndCapability.primaryAreasOfSupportOfferedOther.toString() : '',
+            "Primary Areas Of Support Required Description": partnerData.strengthAndCapability.primaryAreasOfSupportRequired.map(option => option.name).join(', '),
+            "Primary Areas Of Support Required Other": partnerData.strengthAndCapability.primaryAreasOfSupportRequiredOther,
+        }]
+
+
+
+        let surveyCtoHIIData = [];
+        for (const hiidata of partnerData.surveyCtoData.hiiData) {
+            let partnerHiiDetails = {
+                "HII Id": hiidata.id,
+                "HII Name": hiidata.name,
+                "HII Packages Health": hiidata.packagesHealth,
+                "HII Implementation Status": hiidata.implementationStatus,
+                "HII Disaggregation Note": hiidata.disaggregationNote,
+                "HII No Of Males": hiidata.id,
+                "HII No Of Females": hiidata.noOfMales,
+                "HII No Of Transgender": hiidata.noOfTransgender,
+                "HII Health Remarks": hiidata.healthRemarks,
+                "HII Relevant Documents": hiidata.relevantDocuments,
             }
-            surveyCtoHIIData.forEach(data => {
-                exportHiiData.push(data)
-            })
-
-            let surveyCtoSpData = []
-            for (const spData of partnerData.surveyCtoData.spData) {
-                let partnerSpDetails = {
-                    "SP Id": spData.id,
-                    "SP Name": spData.name,
-                    "SP Status": spData.status,
-                    "SP TotalAggregation": spData.totalAggregation,
-                    "SP OtherRemarks": spData.otherRemarks,
-                    "SP RelevantDocuments": spData.relevantDocuments,
-                }
-
-                surveyCtoSpData.push(partnerSpDetails)
+            surveyCtoHIIData.push(partnerHiiDetails)
+        }
+        surveyCtoHIIData.forEach(data => {
+            exportHiiData.push(data)
+        })
+
+        let surveyCtoSpData = []
+        for (const spData of partnerData.surveyCtoData.spData) {
+            let partnerSpDetails = {
+                "SP Id": spData.id,
+                "SP Name": spData.name,
+                "SP Status": spData.status,
+                "SP TotalAggregation": spData.totalAggregation,
+                "SP OtherRemarks": spData.otherRemarks,
+                "SP RelevantDocuments": spData.relevantDocuments,
             }
-            surveyCtoSpData.forEach(data => {
-                exportSpData.push(data)
-            })
-
-            let surveyCtoSpSchemaData = []
-            for (const spSchema of partnerData.surveyCtoData.spSchemeData) {
-                let partnerSpSchemaDetails = {
-                    "SPSchema SchemeId": spSchema.schemeId,
-                    "SPSchema Count": spSchema.count,
-                }
-
-                surveyCtoSpSchemaData.push(partnerSpSchemaDetails)
+
+            surveyCtoSpData.push(partnerSpDetails)
+        }
+        surveyCtoSpData.forEach(data => {
+            exportSpData.push(data)
+        })
+
+        let surveyCtoSpSchemaData = []
+        for (const spSchema of partnerData.surveyCtoData.spSchemeData) {
+            let partnerSpSchemaDetails = {
+                "SPSchema SchemeId": spSchema.schemeId,
+                "SPSchema Count": spSchema.count,
             }
-            surveyCtoSpSchemaData.forEach(data => {
-                exportSPSchemaData.push(data)
-            })
-
-            surveyCtoData.push(exportHiiData)
-            surveyCtoData.push(exportSpData)
-            surveyCtoData.push(exportSPSchemaData)
-    
-            this.exportData = exportData;
-            this.exportSurveyCtoData = surveyCtoData
+
+            surveyCtoSpSchemaData.push(partnerSpSchemaDetails)
+        }
+        surveyCtoSpSchemaData.forEach(data => {
+            exportSPSchemaData.push(data)
+        })
+
+        surveyCtoData.push(exportHiiData)
+        surveyCtoData.push(exportSpData)
+        surveyCtoData.push(exportSPSchemaData)
+
+        this.exportData = exportData;
+        this.exportSurveyCtoData = surveyCtoData
     }
 
-    exportProfileData(exportType: exportType) {
+    exportProfileData(exportType: ExportType) {
         const fileTypeXLS = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8',
             fileTypeCSV = 'text/csv;charset=utf-8;',
             fileExtension = exportType === 'CSV' ? '.csv' : '.xlsx',
@@ -169,6 +169,10 @@ export class PartnerDetailsComponent implements OnInit {
 
         let blob;
 
+        if (!this.partnerDetails) {
+            return;
+        }
+
         this.loadExportData(this.partnerDetails)
 
         const partnerData = XLSX.utils.json_to_sheet(this.exportData);
diff --git a/src/app/services/partner-profile.service.ts b/src/app/services/partner-profile.service.ts
index f6f3a52..2e4d5c8 100644
--- a/src/app/services/partner-profile.service.ts
+++ b/src/app/services/partner-profile.service.ts
@@ -2,7 +2,7 @@ import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { lastValueFrom } from 'rxjs';
 
-export const BASE_URL = 'http://143.110.247.94';
+export const BASE_URL = 'http://localhost:8001';
 // http://localhost:8001
 // http://143.110.247.94