Openlayers - Unable to set the style of features

Question

I have tried to change the default style of my features, but nothing works. I have a database with the features of my user. These features I add manually to a Vectorlayer. But when i try to edit the style of those features. I have both tried feature.style = selected_polygon_style; and feature.setStyle(selected_polygon_style);. The first just doesn't change the style and the second one gives me a "AssertionError: Assertion failed." error.

let vectorSource = new VectorSource({
        format: new GeoJSON(),
        minScale: 15000000,
        strategy: bboxStrategy,
      });
      newFeatures.forEach((newFeature) => {
        let feature = new Feature({
          geometry: new Polygon([newFeature.geometry]),
        });
        feature.setId(newFeature.plotId);
        var selected_polygon_style = {
          strokeWidth: 5,
          strokeColor: "#ff0000",
          fillColor: "#aa2727",
        };
        feature.style = selected_polygon_style;
        vectorSource.addFeature(feature);
      });
      var vector = new Vector({
        //minZoom: 13,
        source: vectorSource,
      });
      this.setInteractionForPlotBoundriesLayer(vector, featureSelected);
      vector.set("name", "plotUserBoundriesLayer");
      this.plotsExtent = vectorSource.getExtent();
      this.map.addLayer(vector);

I use React combined with OpenLayers. So the this.map is created like as follows:

createNewMap() {
    this.map = this.createMap();
  }

  createMap() {
    return new Map({
      target: null,
      layers: [],
      view: new View({
        center: [594668.0262129545, 6602083.305674396],
        maxZoom: 19,
        zoom: 14,
      }),
    });
  }

Answer 1

The style needs to be defined as

    var selected_polygon_style = new Style({
      stroke: new Stroke({
        width: 5,
        color: "#ff0000"
      },
      fill: new Fill({
        color: "#aa2727"
      })
    });

then set using

   feature.setStyle(selected_polygon_style);