How to use the scrivito.registerComponent function in scrivito

currentIcon={currentIcon}
            searchValue={this.state.searchValue}
            setWidgetIcon={this.setWidgetIcon}
          />
          
        
      
    );
  }
}

Scrivito.registerComponent("IconEditorTab", IconEditorTab);

}

    const containerWidget = this.props.widget;

    adjustNumberOfColumns(containerWidget, newGrid.length);
    distributeContents(
      containerWidget.get("columns"),
      this.state.originalContents
    );
    adjustColSize(containerWidget.get("columns"), newGrid);

    this.setState({ currentGrid: gridOfWidget(containerWidget) });
  }
}

Scrivito.registerComponent("ColumnsEditorTab", ColumnsEditorTab);

const PresetGrid = Scrivito.connect(
  ({ currentGrid, adjustGrid, title, grid }) => {
    const classNames = ["gle-preview"];
    if (isEqual(currentGrid, grid)) {
      classNames.push("active");
    }

    return (
      <div title="{title}"> adjustGrid(grid)}
      &gt;
        {grid.map((colSize, index) =&gt; (
          <div></div></div>

import * as React from "react";
import * as Scrivito from "scrivito";
import getMetadata from "../../utils/getMetadata";

Scrivito.registerComponent("SocialCardsTab", ({ obj }) => (
  <div>
    <div>
      <div>
        <div>
          <div>
            
          </div>
        </div>
        <div>
          <div>
            
          </div>
        </div>
      </div>
    </div>
</div>