import PlusOutlined from "@ant-design/icons/PlusOutlined" ; import { IApp } from "@staticdeploy/core" ; import isNil from "lodash/isNil" ; import React from "react" ; import { RouteComponentProps } from "react-router-dom" ; import { withData } from "../../components/DataFetcher" ; import LinksList from "../../components/LinksList" ; import ODItem from "../../components/OperationsDropdown/Item" ; import Page from "../../components/Page" ; import AppCreateOperationModal from "./AppCreateOperationModal" ; const AppsLinksList = LinksList as new ( ) => LinksList < IApp > ; interface IUrlParams { appId ? : string ; } type Props = { result : IApp [ ] ; refetch : ( ) => void ; } & RouteComponentProps < IUrlParams > ; class AppsList extends React . Component < Props > { getActions ( ) { return [ < AppCreateOperationModal key = "AppCreateOperationModal" history = { this . props . history } trigger = { < ODItem icon = { < PlusOutlined / > } label = "Create app" / > } refetchAppsList = { this . props . refetch } / > , ] ; } render ( ) { return ( < Page title = "Apps list" actions = { this . getActions ( ) } > < AppsLinksList title = "Apps" items = { this . props . result } getDescription = { ( app ) => app . name } getHref = { ( app ) => `/apps/${ app . id }` } /> < /Page>); } } export default withData ( { fetchData : ( staticdeploy ) => staticdeploy . apps . getAll ( ) , shouldRefetch : ( oldProps , newProps ) => ! isNil ( oldProps . match . params . appId ) && isNil ( newProps . match . params . appId ) , spinnerSize : "large" , spinnerTip : "Fetching apps..." , Component : AppsList , } ) ;