Migrating from legacy config

import { migrateFromLegacyGraphConfig } from '@graphysdk/core';

// New config: import type { GraphConfig } from '@graphysdk/core';
// Old config: import type { InternalGraphConfig } from '@graphysdk/core';

import { Graph, GraphProvider, graphyLightTheme, migrateFromLegacyGraphConfig } from '@graphysdk/core';

const legacyConfig = {
  data: [
    { month: 'Jan', sales: 1000 },
    { month: 'Feb', sales: 1200 }
  ],
  datasetConfig: {
    properties: [
      { key: 'month', label: 'Month' },
      { key: 'sales', label: 'Sales' }
    ]
  },
  visualisationConfig: {
    type: 'column'
  },
  // ... other legacy properties
};

// Optional: custom palettes
const myCustomPalettes = [
  {
    id: 'brand',
    name: 'Brand',
    colors: [
      { id: '1', hex: '#3b82f6', name: 'Blue' }
    ]
  }
];

// Optional: custom theme
const myTheme = { ...graphyLightTheme, values: { ...graphyLightTheme.values, brand: '#3b82f6' } };

// Migrate to new format
const {
  config: migratedConfig,
  uiLocale, // only present if visualisationConfig.locale was set in the legacy config
  formattingLocale, // only present if visualisationConfig.locale was set in the legacy config
  fontList, // only present if fontList was set in the legacy config
} = migrateFromLegacyGraphConfig({
  config: legacyConfig,
  customPalettes: myCustomPalettes,
  theme: myTheme,
});

// New version of the `GraphProvider` which accepts the new set of props returned by the migration function:
<GraphProvider config={migratedConfig} uiLocale={uiLocale} formattingLocale={formattingLocale} fontList={fontList}>
  <Graph />
</GraphProvider>