const path = require("path");
const fs = require("fs-extra");
const prettier = require("prettier");
const WebpackIconfontPluginNodejs = require("webpack-iconfont-plugin-nodejs");

const fonts = ["fill", "outline"];
const upperName = (name) => name.charAt(0).toUpperCase() + name.slice(1);

fs.ensureDirSync("fonts");
fs.ensureDirSync("iconfont");

fonts.forEach((name) => {
  const fontName = `ant${name}`;
  const uppercaseName = upperName(name);

  const svgFolder = path.resolve(
    process.cwd(),
    "../icons-svg/svg/",
    // compatible old one
    name === "fill" ? "filled" : "outlined"
  );
  const dist = `iconfont/${name}`;

  var options = {
    fontName,
    svgs: path.join(svgFolder, "*.svg"),
    fontsOutput: path.join(dist, ""),
    cssOutput: path.join(dist, "font.css"),
    htmlOutput: path.join(dist, "_font-preview.html"),
    jsOutput: path.join(dist, "fonts.json"),
  };
  new WebpackIconfontPluginNodejs(options).build(async () => {
    // Read the generated JavaScript file and execute it to get the data
    const jsContent = fs.readFileSync(options.jsOutput, 'utf8');
    // Convert ES6 export to CommonJS and execute
    const commonJsContent = jsContent
      .replace(/\/\*[\s\S]*?\*\//g, '') // Remove comments
      .replace(/export\s+default\s+/, 'module.exports = ');

    // Execute the modified JavaScript
    const json = eval(commonJsContent);
    fs.copyFileSync(
      path.join(dist, `${fontName}.ttf`),
      `fonts/${fontName}.ttf`
    );

    // Convert array to object for easier access
    const glyphMap = {};
    json.forEach(item => {
      glyphMap[item.name] = parseInt(item.unicode, 16);
    });

    const content = `
// Note: this file was generated by 'npm run generate' do not modify it manually
// tslint:disable
import * as React from 'react';
import { Text, TextProps, TextStyle } from 'react-native';
export const ${name}GlyphMap = ${JSON.stringify(glyphMap, null, 2)};

export type ${uppercaseName}GlyphMapType = keyof typeof ${name}GlyphMap;

export interface Icon${uppercaseName}Props extends TextProps {
	name: ${uppercaseName}GlyphMapType;
	size?: number;
	color?: string
}

export default class Icon${uppercaseName} extends React.PureComponent<Icon${uppercaseName}Props> {
  render() {
    const {
      name,
      style,
      children,
      size = 14,
      color = "black",
      ...props
    } = this.props;
    const styleOverrides: TextStyle = {
      fontFamily: "ant${name}",
      fontWeight: "normal",
      fontStyle: "normal",
      fontSize: size,
      color
    };
    let glyph = name ? ${name}GlyphMap[name] || "?" : "";
    if (typeof glyph === "number") {
      glyph = String.fromCharCode(glyph);
    }
    return (
      <Text {...props} style={[styleOverrides, style]}>
        {glyph}
        {children}
      </Text>
    );
  }
}

		`;

    // Prettier 3.x format() is async, need to await
    const formatted = await prettier.format(content, { parser: "typescript" });
    fs.writeFileSync(`src/${name}.tsx`, formatted);
  });
});

// index.tsx
const contents = fonts.map((font) => {
  return [
    `export { default as Icon${upperName(font)} } from './${font}';\n`,
    `export type { Icon${upperName(font)}Props, ${upperName(font)}GlyphMapType } from './${font}';\n`
  ].join('');
});

fs.writeFileSync("src/index.tsx", contents.join(""));
