import React from "react";
import { Plugin } from "@scm-manager/ui-types";
import PluginGroupEntry from "../components/PluginGroupEntry";
import groupByCategory from "./groupByCategory";

type Props = {
  plugins: Plugin[];
  refresh: () => void;
};

class PluginList extends React.Component<Props> {
  render() {
    const { plugins, refresh } = this.props;

    const groups = groupByCategory(plugins);
    return (
      <div className="content is-plugin-page">
        {groups.map(group => {
          return <PluginGroupEntry group={group} key={group.name} refresh={refresh} />;
        })}
      </div>
    );
  }
}

export default PluginList;