import pc from 'picocolors';
import {DEPENDENCIES} from '../../../../src/dependencies';
import {
  Framework,
  FrameworkTypes,
  FrameworkVariants,
} from '../../../../src/interfaces';
import {SharedTemplates} from '../../../../src/generatedTemplatesList';

const CONFIG: Framework = {
  type: FrameworkTypes.CLIENT,
  name: 'preact',
  display: 'Preact',
  color: pc.gray,
  templates: [SharedTemplates.ClientAssets],
  sdkUri: 'http://localhost:3000',
  redirectUri: '',
  scopes: ['boards:read', 'boards:write'],
  customPackageJSONFields: {
    scripts: {
      build: 'preact build --no-sw --template src/index.html --dest ./dist',
      'serve:prod': 'sirv build -p 3000 --cors --single',
      'serve:dev': 'preact watch -p 3000 --template src/index.html',
      start: 'preact watch -p 3000 --template src/index.html',
    },
    dependencies: {
      preact: '^10.3.2',
      'preact-render-to-string': '^5.1.4',
      ...DEPENDENCIES.mirotone,
    },
    devDependencies: {
      'preact-cli': '^3.0.0',
      'sirv-cli': '1.0.3',
    },
  },
  customTSConfig: {
    compilerOptions: {
      jsx: 'react-jsx',
      jsxImportSource: 'preact',
      typeRoots: ['./node_modules/@types', './node_modules/@mirohq'],
    },
  },
  variants: [
    {
      name: FrameworkVariants.js,
      display: 'JavaScript',
      color: pc.yellow,
    },
    {
      name: FrameworkVariants.ts,
      display: 'TypeScript',
      color: pc.blue,
      deps: {
        dependencies: {
          ...DEPENDENCIES.typescript,
        },
        devDependencies: {
          ...DEPENDENCIES.miroWebSdkTypes,
        },
      },
    },
  ],
};
export default CONFIG;