How to sort column in mui datagrid with data in English and Japanese

I have an MUI datagrid which contains data in English as well as Japanese. Also, there are null values in some fields. I want to sort the column but the default Ascending and Descending Sort is not giving the right output and the order is random. I have tried using the

Intl.Collator('jp-JP').compare(a, b)

but i am not getting the right output. My code is as follows

columns.push({
      field: 'brewShipDistLocId',
      headerName: nowrapHeader(appLanguages.selectDistToShip[lang]),
      renderCell: (params) =>
        getSelectCustomBodyRender(
          this.getBrewShipRestLocOptionMap(params.row.brewShipDistLocId),
          params.row.brewShipDistLocId,
        ),
      flex: 1,
      sortComparator: (a, b) => {
        new Intl.Collator('jp-JP').compare(a, b);
      },
    });

Data grid

<DataGrid
              sx={{
                '& .MuiDataGrid-columnHeaderCheckbox .MuiDataGrid-columnHeaderTitleContainer': {
                  display: 'none',
                },
              }}
              rows={this.state.cancelShipFlag ? filter_row_data : serialsList || []}
              columns={columns}
              rowsPerPageOptions={[25, 50, 100]}
              checkboxSelection={this.state.cancelShipFlag ? true : false}
              disableSelectionOnClick={false}
              components={{
                Toolbar: NewToolbar,
              }}
</DataGrid>

Unfortunately, I do not have enough score to upload images of my output