diff --git a/modules/ui/src/app/mocks/certificate.mock.ts b/modules/ui/src/app/mocks/certificate.mock.ts
index 65d0be109..278dc8ec0 100644
--- a/modules/ui/src/app/mocks/certificate.mock.ts
+++ b/modules/ui/src/app/mocks/certificate.mock.ts
@@ -22,12 +22,22 @@ export const certificate = {
 } as Certificate;
 
 export const certificate_uploading = {
-  name: 'test',
+  name: 'name.cert',
   uploading: true,
 } as Certificate;
 
 export const certificate2 = {
-  name: 'sensor.bms.google.com',
+  name: 'sensor.bms.google.com.cert',
   organisation: 'Google, Inc.',
   expires: '2024-09-01T09:00:12Z',
 } as Certificate;
+
+export const INVALID_FILE = {
+  name: 'some very long strange name with symbols!?.jpg',
+  size: 7000,
+} as File;
+
+export const FILE = {
+  name: 'name.cert',
+  size: 3000,
+} as File;
diff --git a/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.html b/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.html
index 28bc1768a..eeb4fb6c8 100644
--- a/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.html
+++ b/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.html
@@ -14,7 +14,6 @@
       *ngIf="certificate.uploading"
       mode="indeterminate"></mat-progress-bar>
   </div>
-
   <button
     [disabled]="certificate.uploading"
     class="certificate-item-delete"
diff --git a/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.scss b/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.scss
index 3f09e90e2..db2a2fb9c 100644
--- a/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.scss
+++ b/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.scss
@@ -21,15 +21,16 @@
     --mdc-linear-progress-active-indicator-color: #1967d2;
   }
 }
+
 :host:first-child .certificate-item-container {
   border-top: 1px solid $lighter-grey;
 }
+
 .certificate-item-container {
   display: grid;
   grid-template-columns: 24px minmax(200px, 1fr) 24px;
   gap: 16px;
   box-sizing: border-box;
-  height: 88px;
   padding: 12px 0;
   border-bottom: 1px solid $lighter-grey;
 }
diff --git a/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.spec.ts b/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.spec.ts
index b0395e254..5840aa2bb 100644
--- a/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.spec.ts
+++ b/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.spec.ts
@@ -69,7 +69,7 @@ describe('CertificateItemComponent', () => {
           const deleteSpy = spyOn(component.deleteButtonClicked, 'emit');
           deleteButton.click();
 
-          expect(deleteSpy).toHaveBeenCalledWith('iot.bms.google.com');
+          expect(deleteSpy).toHaveBeenCalledWith(certificate.name);
         });
       });
     });
@@ -83,7 +83,7 @@ describe('CertificateItemComponent', () => {
       it('should have loader', () => {
         const loader = compiled.querySelector('mat-progress-bar');
 
-        expect(loader).toBeDefined();
+        expect(loader).not.toBeNull();
       });
 
       it('should have disabled delete button', () => {
diff --git a/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.ts b/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.ts
index 87e3a8160..eb6019b98 100644
--- a/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.ts
+++ b/modules/ui/src/app/pages/certificates/certificate-item/certificate-item.component.ts
@@ -5,11 +5,18 @@ import { CommonModule } from '@angular/common';
 import { MatButtonModule } from '@angular/material/button';
 import { MatProgressBarModule } from '@angular/material/progress-bar';
 import { provideAnimations } from '@angular/platform-browser/animations';
+import { MatError } from '@angular/material/form-field';
 
 @Component({
   selector: 'app-certificate-item',
   standalone: true,
-  imports: [MatIcon, MatButtonModule, MatProgressBarModule, CommonModule],
+  imports: [
+    MatIcon,
+    MatButtonModule,
+    MatProgressBarModule,
+    CommonModule,
+    MatError,
+  ],
   providers: [provideAnimations()],
   templateUrl: './certificate-item.component.html',
   styleUrl: './certificate-item.component.scss',
diff --git a/modules/ui/src/app/pages/certificates/certificate-upload-button/certificate-upload-button.component.html b/modules/ui/src/app/pages/certificates/certificate-upload-button/certificate-upload-button.component.html
index cea3fb1b4..0c1724e55 100644
--- a/modules/ui/src/app/pages/certificates/certificate-upload-button/certificate-upload-button.component.html
+++ b/modules/ui/src/app/pages/certificates/certificate-upload-button/certificate-upload-button.component.html
@@ -10,4 +10,5 @@
   #file_input
   id="default-file-input"
   type="file"
+  accept=".cert,.crt,.pem,.cer"
   (change)="fileChange($event)" />
diff --git a/modules/ui/src/app/pages/certificates/certificate-upload-button/certificate-upload-button.component.ts b/modules/ui/src/app/pages/certificates/certificate-upload-button/certificate-upload-button.component.ts
index 5b06163b4..88cf522b4 100644
--- a/modules/ui/src/app/pages/certificates/certificate-upload-button/certificate-upload-button.component.ts
+++ b/modules/ui/src/app/pages/certificates/certificate-upload-button/certificate-upload-button.component.ts
@@ -11,8 +11,8 @@ import { MatButtonModule } from '@angular/material/button';
 export class CertificateUploadButtonComponent {
   @Output() fileChanged = new EventEmitter<File>();
   fileChange(event: Event) {
-    const fileList = (event.target as HTMLInputElement).files;
-
+    const input = event.target as HTMLInputElement;
+    const fileList = input.files;
     if (fileList && fileList.length < 1) {
       return;
     }
@@ -21,5 +21,7 @@ export class CertificateUploadButtonComponent {
     const file: File = fileList[0];
 
     this.fileChanged.emit(file);
+    input.value = '';
+    input.dispatchEvent(new Event('change'));
   }
 }
diff --git a/modules/ui/src/app/pages/certificates/certificate.validator.ts b/modules/ui/src/app/pages/certificates/certificate.validator.ts
new file mode 100644
index 000000000..c9445f16d
--- /dev/null
+++ b/modules/ui/src/app/pages/certificates/certificate.validator.ts
@@ -0,0 +1,36 @@
+const FILE_SIZE = 4;
+export const FILE_NAME_LENGTH = 24;
+const FILE_NAME_REGEXP = new RegExp('^[\\w.-]{1,24}$', 'u');
+const FILE_EXT_REGEXP = new RegExp('(\\.cert|\\.crt|\\.pem|\\.cer)$', 'i');
+
+export const getValidationErrors = (file: File): string[] => {
+  const errors = [];
+  errors.push(validateFileName(file.name));
+  errors.push(validateExtension(file.name));
+  errors.push(validateFileNameLength(file.name));
+  errors.push(validateSize(file.size));
+  // @ts-expect-error null values are filtered
+  return errors.filter(error => error !== null);
+};
+const validateFileName = (name: string): string | null => {
+  const result = FILE_NAME_REGEXP.test(name);
+  return !result
+    ? 'The file name should be alphanumeric, symbols  -_. are allowed.'
+    : null;
+};
+
+const validateExtension = (name: string): string | null => {
+  const result = FILE_EXT_REGEXP.test(name);
+  return !result ? 'File extension must be .cert, .crt, .pem, .cer.' : null;
+};
+
+const validateFileNameLength = (name: string): string | null => {
+  return name.length > FILE_NAME_LENGTH
+    ? `Max name length is ${FILE_NAME_LENGTH} characters.`
+    : null;
+};
+
+const validateSize = (size: number): string | null => {
+  const result = size > FILE_SIZE * 1000;
+  return result ? `File size should be a max of ${FILE_SIZE}KB` : null;
+};
diff --git a/modules/ui/src/app/pages/certificates/certificates.component.spec.ts b/modules/ui/src/app/pages/certificates/certificates.component.spec.ts
index 0a50f6b9d..3f611d962 100644
--- a/modules/ui/src/app/pages/certificates/certificates.component.spec.ts
+++ b/modules/ui/src/app/pages/certificates/certificates.component.spec.ts
@@ -32,6 +32,7 @@ import { MatDialogRef } from '@angular/material/dialog';
 import { DeleteFormComponent } from '../../components/delete-form/delete-form.component';
 import { TestRunService } from '../../services/test-run.service';
 import { NotificationService } from '../../services/notification.service';
+import { FILE, INVALID_FILE } from '../../mocks/certificate.mock';
 
 describe('CertificatesComponent', () => {
   let component: CertificatesComponent;
@@ -43,11 +44,12 @@ describe('CertificatesComponent', () => {
     jasmine.createSpyObj(['notify']);
 
   beforeEach(async () => {
-    mockService = jasmine.createSpyObj([
+    mockService = jasmine.createSpyObj('mockService', [
       'fetchCertificates',
       'deleteCertificate',
       'uploadCertificate',
     ]);
+    mockService.uploadCertificate.and.returnValue(of(true));
     mockService.deleteCertificate.and.returnValue(of(true));
     mockService.fetchCertificates.and.returnValue(
       of([certificate, certificate])
@@ -65,6 +67,7 @@ describe('CertificatesComponent', () => {
     fixture = TestBed.createComponent(CertificatesComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
+    mockService.uploadCertificate.calls.reset();
   });
 
   it('should create', () => {
@@ -175,5 +178,19 @@ describe('CertificatesComponent', () => {
         flush();
       }));
     });
+
+    describe('#uploadFile', () => {
+      it('should not call uploadCertificate if file has errors', () => {
+        component.uploadFile(INVALID_FILE);
+
+        expect(mockService.uploadCertificate).not.toHaveBeenCalled();
+      });
+
+      it('should call uploadCertificate if there is no errors', () => {
+        component.uploadFile(FILE);
+
+        expect(mockService.uploadCertificate).toHaveBeenCalled();
+      });
+    });
   });
 });
diff --git a/modules/ui/src/app/pages/certificates/certificates.component.ts b/modules/ui/src/app/pages/certificates/certificates.component.ts
index 0e0b805b1..3a12c4c14 100644
--- a/modules/ui/src/app/pages/certificates/certificates.component.ts
+++ b/modules/ui/src/app/pages/certificates/certificates.component.ts
@@ -24,6 +24,7 @@ import { CertificatesStore } from './certificates.store';
 import { DeleteFormComponent } from '../../components/delete-form/delete-form.component';
 import { Subject, takeUntil } from 'rxjs';
 import { MatDialog } from '@angular/material/dialog';
+import { FILE_NAME_LENGTH } from './certificate.validator';
 
 @Component({
   selector: 'app-certificates',
@@ -67,14 +68,14 @@ export class CertificatesComponent implements OnDestroy {
     this.store.uploadCertificate(file);
   }
 
-  deleteCertificate(name: string) {
-    this.store.selectCertificate(name);
+  deleteCertificate(certificate: string) {
+    this.store.selectCertificate(certificate);
 
     const dialogRef = this.dialog.open(DeleteFormComponent, {
       ariaLabel: 'Delete certificate',
       data: {
         title: 'Delete certificate',
-        content: `You are about to delete a certificate ${name}. Are you sure?`,
+        content: `You are about to delete a certificate ${this.getShortCertificateName(certificate)}. Are you sure?`,
       },
       autoFocus: true,
       hasBackdrop: true,
@@ -87,7 +88,7 @@ export class CertificatesComponent implements OnDestroy {
       .pipe(takeUntil(this.destroy$))
       .subscribe(deleteCertificate => {
         if (deleteCertificate) {
-          this.store.deleteCertificate(name);
+          this.store.deleteCertificate(certificate);
           this.focusNextButton();
         }
       });
@@ -108,4 +109,10 @@ export class CertificatesComponent implements OnDestroy {
       menuButton?.focus();
     }
   }
+
+  private getShortCertificateName(name: string) {
+    return name.length <= FILE_NAME_LENGTH
+      ? name
+      : `${name.substring(0, FILE_NAME_LENGTH)}...`;
+  }
 }
diff --git a/modules/ui/src/app/pages/certificates/certificates.store.spec.ts b/modules/ui/src/app/pages/certificates/certificates.store.spec.ts
index f42b9e928..624f50638 100644
--- a/modules/ui/src/app/pages/certificates/certificates.store.spec.ts
+++ b/modules/ui/src/app/pages/certificates/certificates.store.spec.ts
@@ -22,6 +22,8 @@ import {
   certificate,
   certificate2,
   certificate_uploading,
+  FILE,
+  INVALID_FILE,
 } from '../../mocks/certificate.mock';
 import { CertificatesStore } from './certificates.store';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
@@ -111,33 +113,51 @@ describe('CertificatesStore', () => {
     });
 
     describe('uploadCertificate', () => {
-      const uploadingCertificate = certificate_uploading;
-
       beforeEach(() => {
         mockService.uploadCertificate.and.returnValue(of(true));
         mockService.fetchCertificates.and.returnValue(of([certificate]));
       });
 
-      it('should update certificates', done => {
-        certificateStore.viewModel$.pipe(skip(1), take(1)).subscribe(store => {
-          expect(store.certificates).toContain(uploadingCertificate);
-        });
+      describe('with valid certificate file', () => {
+        it('should update certificates', done => {
+          const uploadingCertificate = certificate_uploading;
 
-        certificateStore.viewModel$.pipe(skip(2), take(1)).subscribe(store => {
-          expect(store.certificates).toEqual([certificate]);
-          done();
+          certificateStore.viewModel$
+            .pipe(skip(1), take(1))
+            .subscribe(store => {
+              expect(store.certificates).toContain(uploadingCertificate);
+            });
+
+          certificateStore.viewModel$
+            .pipe(skip(2), take(1))
+            .subscribe(store => {
+              expect(store.certificates).toEqual([certificate]);
+              done();
+            });
+
+          certificateStore.uploadCertificate(FILE);
         });
 
-        certificateStore.uploadCertificate(new File([], 'test'));
+        it('should notify', () => {
+          certificateStore.uploadCertificate(FILE);
+          expect(notificationServiceMock.notify).toHaveBeenCalledWith(
+            'Certificate successfully added.\niot.bms.google.com by Google, Inc. valid until 01 Sep 2024',
+            0,
+            'certificate-notification'
+          );
+        });
       });
 
-      it('should notify', () => {
-        certificateStore.uploadCertificate(new File([], 'test'));
-        expect(notificationServiceMock.notify).toHaveBeenCalledWith(
-          'Certificate successfully added.\niot.bms.google.com by Google, Inc. valid until 01 Sep 2024',
-          0,
-          'certificate-notification'
-        );
+      describe('with invalid certificate file', () => {
+        it('should notify about errors', () => {
+          certificateStore.uploadCertificate(INVALID_FILE);
+
+          expect(notificationServiceMock.notify).toHaveBeenCalledWith(
+            'The file name should be alphanumeric, symbols  -_. are allowed.\nFile extension must be .cert, .crt, .pem, .cer.\nMax name length is 24 characters.\nFile size should be a max of 4KB',
+            0,
+            'certificate-notification'
+          );
+        });
       });
     });
 
@@ -152,7 +172,7 @@ describe('CertificatesStore', () => {
           done();
         });
 
-        certificateStore.deleteCertificate('iot.bms.google.com');
+        certificateStore.deleteCertificate(certificate.name);
       });
     });
   });
diff --git a/modules/ui/src/app/pages/certificates/certificates.store.ts b/modules/ui/src/app/pages/certificates/certificates.store.ts
index 1def48617..762671eb5 100644
--- a/modules/ui/src/app/pages/certificates/certificates.store.ts
+++ b/modules/ui/src/app/pages/certificates/certificates.store.ts
@@ -16,12 +16,13 @@
 
 import { Injectable } from '@angular/core';
 import { ComponentStore } from '@ngrx/component-store';
-import { tap, withLatestFrom } from 'rxjs/operators';
-import { catchError, EMPTY, exhaustMap, throwError } from 'rxjs';
+import { switchMap, tap, withLatestFrom } from 'rxjs/operators';
+import { catchError, EMPTY, exhaustMap, of, throwError } from 'rxjs';
 import { Certificate } from '../../model/certificate';
 import { TestRunService } from '../../services/test-run.service';
 import { NotificationService } from '../../services/notification.service';
 import { DatePipe } from '@angular/common';
+import { getValidationErrors } from './certificate.validator';
 
 export interface AppComponentState {
   certificates: Certificate[];
@@ -64,7 +65,17 @@ export class CertificatesStore extends ComponentStore<AppComponentState> {
   uploadCertificate = this.effect<File>(trigger$ => {
     return trigger$.pipe(
       withLatestFrom(this.certificates$),
-      tap(([file, certificates]) => {
+      switchMap(res => {
+        const [file] = res;
+        const errors = getValidationErrors(file);
+        if (errors.length > 0) {
+          this.notify(errors.join('\n'));
+          return EMPTY;
+        }
+        return of(res);
+      }),
+      tap(res => {
+        const [file, certificates] = res;
         this.addCertificate(file.name, certificates);
       }),
       exhaustMap(([file, certificates]) => {
@@ -81,14 +92,11 @@ export class CertificatesStore extends ComponentStore<AppComponentState> {
                 !certificates.some(cert => cert.name === certificate.name)
             )[0];
             this.updateCertificates(newCertificates);
-            this.notificationService.notify(
-              `Certificate successfully added.\n${uploadedCertificate.name} by ${uploadedCertificate.organisation} valid until ${this.datePipe.transform(uploadedCertificate.expires, 'dd MMM yyyy')}`,
-              0,
-              'certificate-notification'
+            this.notify(
+              `Certificate successfully added.\n${uploadedCertificate.name} by ${uploadedCertificate.organisation} valid until ${this.datePipe.transform(uploadedCertificate.expires, 'dd MMM yyyy')}`
             );
           }),
           catchError(() => {
-            this.removeCertificate(file.name, certificates);
             return EMPTY;
           })
         );
@@ -103,19 +111,26 @@ export class CertificatesStore extends ComponentStore<AppComponentState> {
 
   deleteCertificate = this.effect<string>(trigger$ => {
     return trigger$.pipe(
-      exhaustMap((name: string) => {
-        return this.testRunService.deleteCertificate(name).pipe(
-          withLatestFrom(this.certificates$),
-          tap(([remove, current]) => {
+      withLatestFrom(this.certificates$),
+      exhaustMap(([certificate, current]) => {
+        return this.testRunService.deleteCertificate(certificate).pipe(
+          tap(remove => {
             if (remove) {
-              this.removeCertificate(name, current);
+              this.removeCertificate(certificate, current);
             }
+          }),
+          catchError(() => {
+            return EMPTY;
           })
         );
       })
     );
   });
 
+  private notify(message: string) {
+    this.notificationService.notify(message, 0, 'certificate-notification');
+  }
+
   private removeCertificate(name: string, current: Certificate[]) {
     const certificates = current.filter(
       certificate => certificate.name !== name