How to use the @elastic/charts.ScaleType.Time function in @elastic/charts

export function getScaleType(metadata: OperationMetadata | null, defaultScale: ScaleType) {
  if (!metadata) {
    return defaultScale;
  }

  // use scale information if available
  if (metadata.scale === 'ordinal') {
    return ScaleType.Ordinal;
  }
  if (metadata.scale === 'interval' || metadata.scale === 'ratio') {
    return metadata.dataType === 'date' ? ScaleType.Time : ScaleType.Linear;
  }

  // fall back to data type if necessary
  switch (metadata.dataType) {
    case 'boolean':
    case 'string':
      return ScaleType.Ordinal;
    case 'date':
      return ScaleType.Time;
    default:
      return ScaleType.Linear;
  }
}

// use scale information if available
  if (metadata.scale === 'ordinal') {
    return ScaleType.Ordinal;
  }
  if (metadata.scale === 'interval' || metadata.scale === 'ratio') {
    return metadata.dataType === 'date' ? ScaleType.Time : ScaleType.Linear;
  }

  // fall back to data type if necessary
  switch (metadata.dataType) {
    case 'boolean':
    case 'string':
      return ScaleType.Ordinal;
    case 'date':
      return ScaleType.Time;
    default:
      return ScaleType.Linear;
  }
}

const lineSeries = locationDurationLines.map(line => {
    const locationSpecId = getSpecId('loc-avg' + line.name);
    return (
       [x || 0, microsToMillis(y)])}
        id={locationSpecId}
        key={`locline-${line.name}`}
        name={line.name}
        xAccessor={0}
        xScaleType={ScaleType.Time}
        yAccessors={[1]}
        yScaleToDataExtent={false}
        yScaleType={ScaleType.Linear}
      />
    );
  });

annotationId={getAnnotationId('line-annotation')}
          domainType={AnnotationDomainTypes.XDomain}
          dataValues={lineAnnotationData}
          hideTooltips={true}
          style={lineAnnotationStyle}
        />
        
        
      
    );
  }
}

{watchVisualizationDataKeys.map((key: string) => {
              return (
                
              );
            })}
            {actualThreshold.map((_value: any, i: number) => {

export const Line: FC = ({ chartData }) => {
  return (
    
  );
};

},
    rect: {
      opacity: 1,
    },
  };
  const colors: DataSeriesColorsValues = {
    colorValues: [],
    specId: getSpecId(id),
  };
  const customColors: CustomSeriesColorsMap = new Map();
  customColors.set(colors, color || '#999');
  return (
    
  );
};

export const areachartConfigs = (config?: {
  xTickFormatter: (value: number) => string;
  onBrushEnd?: BrushEndListener;
}) => ({
  series: {
    xScaleType: ScaleType.Time,
    yScaleType: ScaleType.Linear,
  },
  axis: {
    xTickFormatter: get('xTickFormatter', config),
    yTickFormatter: numberFormatter,
  },
  settings: {
    onBrushEnd: getOr(() => {}, 'onBrushEnd', config),
  },
  customHeight: statItemChartCustomHeight,
});

export const ModelBounds: FC = ({ modelData }) => {
  const model = modelData === undefined ? [] : modelData;
  return (
    
  );
};