PrimeFaces 11 fileupload

I am just trying to run simple fileupload with primefaces 11. My body is:

<h:body>
    <h:form enctype="multipart/form-data">
     <p:fileUpload value="#{fileUploadBean.uploadedFile}" mode="simple" skinSimple="true"/>
        <p:commandButton value="Submit" ajax="false" action="#{fileUploadBean.upload}" styleClass="p-mt-3 ui-button-outlined p-d-block"/>
    </h:form>
</h:body>

My bean is

@Component
public class FileUploadBean {

  private UploadedFile uploadedFile;
  private UploadedFiles files;

  public void upload() {
    String fileName = uploadedFile.getFileName();
    String contentType = uploadedFile.getContentType();
    byte[] contents = uploadedFile.getContent(); // Or getInputStream()

  }

  public void uploadMultiple() {
    System.err.println("uploadMultiple");
    if (files != null) {
      for (UploadedFile f : files.getFiles()) {
        FacesMessage message = new FacesMessage("Successful", f.getFileName() + " is uploaded.");
        FacesContext.getCurrentInstance().addMessage(null, message);
      }
    }
  }

  public void handleFileUpload(FileUploadEvent event) {
    UploadedFile uploadedFile = event.getFile();
    System.err.println(uploadedFile.getFileName());
    FacesMessage message =
        new FacesMessage("Successful", event.getFile().getFileName() + " is uploaded.");
    FacesContext.getCurrentInstance().addMessage(null, message);
  }

  public UploadedFile getUploadedFile() {
    return uploadedFile;
  }

  public void setUploadedFile(UploadedFile uploadedFile) {
    this.uploadedFile = uploadedFile;
  }

  public UploadedFiles getFiles() {
    return files;
  }

  public void setFiles(UploadedFiles files) {
    this.files = files;
  }
}

I added this ones to web.xml

<context-param>
        <param-name>primefaces.UPLOADER</param-name>
        <param-value>auto</param-value>
    </context-param>

    <filter>
        <filter-name>PrimeFaces FileUpload Filter</filter-name>
        <filter-class>org.primefaces.webapp.filter.FileUploadFilter</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>PrimeFaces FileUpload Filter</filter-name>
        <servlet-name>Faces Servlet</servlet-name>
    </filter-mapping>
<servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <!-- Map these files with JSF -->
    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>*.jsf</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>*.faces</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>*.xhtml</url-pattern>
    </servlet-mapping>

The problem is "upload" function is not triggering. If I delete the enctype="multipart/form-data" part "upload" function is triggering but uploadedFile field is getting null.

Also I tried all examples in primefaces demo page and nothing is working.

Is anyone has any idea ? I couldn`t find any answer that uses primefaces 11.

Thanks

@Component is an annotation from the Spring Context. If you try to use Spring Framework with JSF and PrimeFaces, i sugest you to use Joinfaces. Here is a working example with file upload.