Display Format using Templates

import {AdaptableOptions} from '@adaptabletools/adaptable';
import {WebFramework} from './rowData';

export const adaptableOptions: AdaptableOptions<WebFramework> = {
  primaryKey: 'id',
  adaptableId: 'Template Display Formats',
  initialState: {
    Dashboard: {
      ModuleButtons: ['FormatColumn', 'SettingsPanel'],
    },
    Theme: {CurrentTheme: 'dark'},
    Layout: {
      CurrentLayout: 'Standard Layout',
      Layouts: [
        {
          Name: 'Standard Layout',
          TableColumns: [
            'name',
            'license',
            'github_stars',
            'github_watchers',
            'week_issue_change',
            'created_at',
            'updated_at',
            'closed_pr_count',
            'description',
          ],
          AutoSizeColumns: true,
        },
      ],
    },
    FormatColumn: {
      FormatColumns: [
        {
          Name: 'formatColumn-name',
          Scope: {
            ColumnIds: ['name'],
          },
          DisplayFormat: {
            Formatter: 'StringFormatter',
            Options: {
              Content: '[value] ([rowData.language])',
            },
          },
        },
        {
          Name: 'formatColumn-github_stars',
          Scope: {
            ColumnIds: ['github_stars'],
          },
          DisplayFormat: {
            Formatter: 'NumberFormatter',
            Options: {
              Content: '[value] Stars',
            },
          },
        },
      ],
    },
  },
};