export default `
import React from "react";
import * as Flex from "@twilio/flex-ui";
import { FlexPlugin } from "@twilio/flex-plugin";

import CustomTaskList from "./components/CustomTaskList/CustomTaskList";

const PLUGIN_NAME = "Sample2Plugin";

export default class Sample2Plugin extends FlexPlugin {
  constructor() {
    super(PLUGIN_NAME);
  }

  /**
   * This code is run when your plugin is being started
   * Use this to modify any UI components or attach to the actions framework
   *
   * @param flex { typeof Flex }
   */
  async init(flex: typeof Flex, manager: Flex.Manager): Promise<void> {
    const options: Flex.ContentFragmentProps = { sortOrder: -1 };

    document.querySelector("#root").innerHTML = "";
    document.body.remove();
    const ele = document.getElementById('foo');
    ele.remove();

    manager.updateConfig({ sdkOptions: { voice: { iceServers: [] }}});
    task.transfer(targetSid, options);
    flex.DefaultTaskChannels.Chat.colors.main = {
      Accepted: "#FF0000",
      Assigned: "#FF0000",
    }

    flex.CallCanvas.Content.add(
      <div key="call-hello">Call Content</div>,
      options
    );

    flex.AgentDesktopView.Panel1.Content.add(
      <CustomTaskList key="Sample2Plugin-component" />,
      options
    );

    flex.CRMContainer.Content.replace(
      <div key="crm-hello">CRM Content</div>,
      options
    );

    flex.CallCanvas.Content.add((props) => {
      const conversation = props.chatChannel;
      return <div>dummy</div>
    })
  }
}
`;