Skip to content

FIX upload 3rd party certification #174

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
fdelavega merged 3 commits into from
Jan 7, 2026
Merged

FIX upload 3rd party certification #174

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
0e07b8d
FIX upload 3rd party certification
laraminones Dec 23, 2025
7fd20fb
ADD allow adding additional certifications + filter them over the mar…
laraminones Dec 24, 2025
026b796
FILTER compliance from normal chars on places that shouldnt be shown
laraminones Dec 29, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 21 additions & 1 deletion src/app/pages/product-details/product-details.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@ <h3 class="text-2xl font-bold text-primary-100 dark:text-primary-50 text-left mb
{{ 'PRODUCT_DETAILS._self_attestation' | translate }}
</a>
}

@if(complianceProf.length>0){
<h3 class="text-2xl font-bold text-primary-100 dark:text-primary-50 text-left mb-2">
3rd party certifications:
</h3>
<div class="flex flex-wrap -mx-4 mt-4 justify-center">
@for (char of complianceProf; track char.id) {
<div class="w-full md:w-1/2 lg:w-1/3 px-4 mb-8 " >
Expand Down Expand Up @@ -307,6 +310,23 @@ <h3 class="text-2xl font-bold mt-4 dark:text-white">{{char.name}}</h3>
</div>
}
</div>
}
@if(additionalCerts.length>0){
<h3 class="text-2xl font-bold text-primary-100 dark:text-primary-50 text-left mb-2">
Additional certifications:
</h3>
<div class="flex flex-wrap -mx-4 mt-4 justify-center">
@for (char of additionalCerts; track char.id) {
<div class="w-full md:w-1/2 lg:w-1/3 px-4 mb-8 " >
<div class="border border-2 rounded-lg shadow bg-white dark:bg-secondary-200 shadow-md p-8 h-full border-primary-100 cursor-pointer" (click)="goToLink(char.productSpecCharacteristicValue?.at(0)?.value)">
<fa-icon [icon]="faAtom" class="fa-2xl text-primary-100 align-middle"></fa-icon>
<h3 class="text-2xl font-bold mt-4 dark:text-white">{{normalizeName(char.name)}}</h3>

</div>
</div>
}
</div>
}
</div>

<h2 class="text-4xl font-extrabold text-primary-100 dark:text-primary-50 text-center pb-8 pt-12">{{ 'PRODUCT_DETAILS._product_pricing' | translate }}</h2>
Expand Down
54 changes: 41 additions & 13 deletions src/app/pages/product-details/product-details.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,7 @@ export class ProductDetailsComponent implements OnInit, OnDestroy {
attatchments: AttachmentRefOrValue[] = [];
prodSpec:ProductSpecification = {};
complianceProf:any[] = [];
additionalCerts:any[] = [];
complianceLevel:string='NL';
complianceDescription:string='No level. This product hasnt reached any compliance level yet.'
serviceSpecs:any[] = [];
Expand Down Expand Up @@ -259,25 +260,48 @@ export class ProductDetailsComponent implements OnInit, OnDestroy {
if(this.prodSpec.productSpecCharacteristic != undefined) {
// Avoid displaying the compliance credential && Avoid showing "- enabled" chars
this.prodChars = this.prodSpec.productSpecCharacteristic.filter((char: any) => {
return char.name != 'Compliance:VC' && char.name != 'Compliance:SelfAtt' && !char.name?.endsWith(' - enabled')
return !char.name.startsWith('Compliance:') && !char.name?.endsWith(' - enabled')
})

for(let i=0; i<certifications.length; i++){
//Now we only show the certifications that are attached when creating/updating the product
let compProf = this.prodSpec.productSpecCharacteristic.find((p => {
return p.name === certifications[i].name
}));
if(compProf){
let cert:any = certifications[i]
cert.href = compProf.productSpecCharacteristicValue?.at(0)?.value
this.complianceProf.push(certifications[i])
this.additionalCerts = this.prodSpec.productSpecCharacteristic.filter((char: any) => {
const cleanedName = char.name.replace('Compliance:', '').trim();

return (
char.name.startsWith('Compliance:') &&
!certifications.some(cert => cert.name === cleanedName) && char.name != 'Compliance:SelfAtt'
);
});
console.log('--- additional')
console.log(this.additionalCerts)

const normalizeName = (name?: string): string =>
name?.replace(/compliance:/i, '').trim() ?? '';

for (let i = 0; i < certifications.length; i++) {

// Buscar característica quitando el prefijo "Compliance:"
let compProf = this.prodSpec.productSpecCharacteristic.find(p => {
return normalizeName(p.name) === certifications[i].name;
});

if (compProf) {
let cert: any = certifications[i];
cert.href = compProf.productSpecCharacteristicValue?.at(0)?.value;
this.complianceProf.push(cert);
}
//Deleting certifications out of characteristics' array
const index = this.prodChars.findIndex(item => item.name === certifications[i].name);
if(index!==-1){

// Eliminar certificaciones del array de características
const index = this.prodChars.findIndex(item =>
normalizeName(item.name) === certifications[i].name
);

if (index !== -1) {
this.prodChars.splice(index, 1);
}
}

console.log(this.complianceProf)


}

Expand Down Expand Up @@ -894,4 +918,8 @@ async deleteProduct(product: Product | undefined){
}
}

normalizeName(name?: string): string {
return name?.replace(/compliance:/i, '').trim() ?? '';
}

}
3 changes: 2 additions & 1 deletion .../pages/seller-offerings/offerings/seller-offer/new-price-plan/new-price-plan.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -143,7 +143,8 @@ export class NewPricePlanComponent implements OnInit, OnDestroy {

checkPriceInfo(){
for(let i=0;i<this.selectedProdSpec.productSpecCharacteristic.length;i++){
if (!certifications.some(certification => certification.name === this.selectedProdSpec.productSpecCharacteristic[i].name)) {
//if (!certifications.some(certification => certification.name === this.selectedProdSpec.productSpecCharacteristic[i].name)) {
if (!certifications.some(certification => certification.name === this.selectedProdSpec.productSpecCharacteristic[i].name) && !this.selectedProdSpec.productSpecCharacteristic[i].name.startsWith('Compliance:')) {
this.createdPriceProfile.push(this.selectedProdSpec.productSpecCharacteristic[i]);
this.filteredCharacteristics.push(this.selectedProdSpec.productSpecCharacteristic[i]);
}
Expand Down
115 changes: 113 additions & 2 deletions ...ings/offerings/seller-product-spec/create-product-spec/create-product-spec.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -282,7 +282,7 @@ <h3 class="font-bold text-primary-100 dark:text-primary-50 text-left ml-4">
'break-all': hasLongWord(sel.name, 20),
'break-words': !hasLongWord(sel.name, 20)
}" class="px-6 py-4 text-wrap break-words">
{{sel.name}}
{{normalizeName(sel.name)}}
</td>
<td class="px-6 py-4 text-wrap break-all">
{{sel.url}}
Expand Down Expand Up @@ -347,7 +347,116 @@ <h3 class="font-bold text-primary-100 dark:text-primary-50 text-left ml-4">
</button>-->
</div>
</div>

@if(additionalISOS.length>0){
<h3 class="font-bold text-primary-100 dark:text-primary-50 text-left ml-4">
You added the following additional certifications:
</h3>
<div class="relative overflow-x-auto shadow-md sm:rounded-lg w-full bg-white dark:bg-secondary-300 m-4">
<table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-200">
<thead class="text-xs text-gray-700 uppercase bg-gray-100 dark:bg-secondary-200 dark:text-white">
<tr>
<th scope="col" class="px-6 py-3">
{{ 'UPDATE_PROD_SPEC._product_name' | translate }}
</th>
<th scope="col" class="px-6 py-3">
{{ 'UPDATE_PROD_SPEC._value' | translate }}
</th>
<th scope="col" class="px-6 py-3">
{{ 'UPDATE_PROD_SPEC._actions' | translate }}
</th>
</tr>
</thead>
<tbody>
@for (cert of additionalISOS; track cert.name; let idx = $index) {
<tr class="border-b hover:bg-gray-200 dark:bg-secondary-300 dark:border-gray-700 dark:hover:bg-secondary-200">
<td [ngClass]="{
'break-all': hasLongWord(cert.name, 20),
'break-words': !hasLongWord(cert.name, 20)
}" class="px-6 py-4 text-wrap break-words">
{{normalizeName(cert.name)}}
</td>
<td class="px-6 py-4 text-wrap break-all">
{{cert.url}}
</td>
<td class="px-6 py-4 inline-flex">
<button (click)="removeCert(cert)" type="button" class="text-white bg-red-600 hover:bg-red-700 focus:ring-4 focus:outline-none focus:ring-red-300 font-medium rounded-full text-sm p-1 text-center inline-flex items-center">
<svg class="w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18 17.94 6M18 18 6.06 6"/>
</svg>
</button>
</td>
</tr>
}
</tbody>
</table>
</div>
}
@if(showCert==false){
<div class="flex w-full justify-items-center justify-center">
<button type="button" (click)="showCert=!showCert" class="flex text-white justify-center bg-primary-100 hover:bg-primary-50 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center inline-flex items-center">
Add an additional certification
<svg class="rtl:rotate-180 w-3.5 h-3.5 ms-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 12h14m-7 7V5"/>
</svg>
</button>
</div>
} @else {
<div class="m-4 w-full">
<h3 class="font-bold text-primary-100 dark:text-primary-50 text-left ml-4">
Add an additional certification:
</h3>
<div class="lg:flex lg:grid lg:grid-cols-2 w-full gap-4 align-items-middle align-middle border border-gray-200 rounded-lg p-4">
<div class="h-fit">
<label for="cert-name" class="font-bold text-lg dark:text-white">{{ 'PROFILE._name' | translate }}</label>
<input #certificationName type="text" id="cert-name" [formControl]="certFileName"
[ngClass]="certFileName.invalid == true ? 'border-red-600' : 'border-gray-300'"
class="mb-2 bg-gray-50 border border-gray-300 text-gray-900 dark:bg-secondary-300 dark:border-secondary-200 dark:text-white text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5" />
</div>
@if(isoToCreate==''){
<ngx-file-drop class="p-4 w-full" dropZoneLabel="Drop files here" (onFileDrop)="dropped($event,'attach')" (onFileOver)="fileOver($event)" (onFileLeave)="fileLeave($event)">
<ng-template class="w-full" ngx-file-drop-content-tmp let-openFileSelector="openFileSelector">
<div class="w-full flex flex-col justify-items-center justify-center">
<svg class="w-12 h-12 text-primary-100 mx-auto" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17h3a3 3 0 0 0 0-6h-.025a5.56 5.56 0 0 0 .025-.5A5.5 5.5 0 0 0 7.207 9.021C7.137 9.017 7.071 9 7 9a4 4 0 1 0 0 8h2.167M12 19v-9m0 0-2 2m2-2 2 2"/>
</svg>
<div class="flex w-full justify-center">
<p class="text-gray-500 mr-2 w-fit">{{ 'UPDATE_PROD_SPEC._drop_files' | translate }}
<button (click)="openFileSelector()" class="font-medium text-primary-100 dark:text-primary-50 hover:underline">{{ 'UPDATE_PROD_SPEC._select_files' | translate }}</button>
</p>
</div>
</div>
</ng-template>
</ngx-file-drop>
} @else {
<div class="relative w-full items-center p-4 text-sm text-primary-100 rounded-lg bg-blue-50 dark:bg-secondary-200 dark:text-primary-50" role="alert">
<span class="sr-only">Info</span>
<label class="text-wrap break-all">
{{isoToCreate}}
</label>
<button (click)="clearAdditionalCert(true)" class="z-10 absolute top-2 right-2 p-1 font-bold text-white bg-red-500 rounded-3xl">
<svg class="w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18 17.94 6M18 18 6.06 6"/>
</svg>
</button>
</div>
}
</div>
<div class="flex w-full justify-items-center justify-center mt-4">
<button type="button" (click)="saveAdditionalCert()"
[disabled]="!certFileName.valid || isoToCreate == ''" [ngClass]="!certFileName.valid || isoToCreate == '' ? 'opacity-50' : 'hover:bg-primary-50'"
class="flex text-white justify-center bg-primary-100 hover:bg-primary-50 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center inline-flex items-center">
Save
<svg class="rtl:rotate-180 w-3.5 h-3.5 ms-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M11 16h2m6.707-9.293-2.414-2.414A1 1 0 0 0 16.586 4H5a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1V7.414a1 1 0 0 0-.293-.707ZM16 20v-6a1 1 0 0 0-1-1H9a1 1 0 0 0-1 1v6h8ZM9 4h6v3a1 1 0 0 1-1 1h-4a1 1 0 0 1-1-1V4Z"/>
</svg>
</button>
<button type="button" (click)="clearAdditionalCert(false);showCert=false;"
class="flex ml-4 text-gray-900 justify-end bg-gray-400 hover:bg-primary-50 focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-5 py-2.5 text-center inline-flex items-center">
Discard
</button>
</div>
</div>
}

}
@if ((currentStep === 2 && !BUNDLE_ENABLED) || (currentStep === 3 && BUNDLE_ENABLED)) {
Expand Down Expand Up @@ -384,6 +493,7 @@ <h3 class="font-bold text-primary-100 dark:text-primary-50 text-left ml-4">
</thead>
<tbody>
@for (prod of prodChars; track prod;) {
@if(!prod.name?.startsWith('Compliance:')){
<tr class="border-b hover:bg-gray-200 dark:bg-secondary-300 dark:border-gray-700 dark:hover:bg-secondary-200">
<td [ngClass]="{
'break-all': hasLongWord(prod.name, 20),
Expand Down Expand Up @@ -430,6 +540,7 @@ <h3 class="font-bold text-primary-100 dark:text-primary-50 text-left ml-4">
</button>
</td>
</tr>
}
}
</tbody>
</table>
Expand Down
Loading
Loading