diff --git a/mailpoet/assets/js/src/segments/dynamic/list.jsx b/mailpoet/assets/js/src/segments/dynamic/list.tsx similarity index 85% rename from mailpoet/assets/js/src/segments/dynamic/list.jsx rename to mailpoet/assets/js/src/segments/dynamic/list.tsx index 34c74c7107..fc3adea8af 100644 --- a/mailpoet/assets/js/src/segments/dynamic/list.jsx +++ b/mailpoet/assets/js/src/segments/dynamic/list.tsx @@ -1,12 +1,42 @@ import { Link, withRouter } from 'react-router-dom'; -import PropTypes from 'prop-types'; import ReactStringReplace from 'react-string-replace'; import { MailPoet } from 'mailpoet'; import { Listing } from 'listing/listing.jsx'; import { escapeHTML } from '@wordpress/escape-html'; +import { SegmentResponse } from 'segments/types'; -const columns = [ +type ColumnType = { + name: string; + label: string; + sortable: boolean; +}; + +type DynamicSegmentItem = { + id: number; + name: string; + description: string; + count_all: string; + count_subscribed: string; + created_at: string; + is_plugin_missing: boolean; + subscribers_url: string; + missing_plugin_message?: { + message: string; + link?: string; + }; +}; + +type DynamicSegmentListComponentProps = { + location: { + pathname: string; + }; + match: { + params; + }; +}; + +const columns: ColumnType[] = [ { name: 'name', label: MailPoet.I18n.t('nameColumn'), @@ -85,10 +115,10 @@ const itemActions = [ { name: 'edit', className: 'mailpoet-hide-on-mobile', - link: (item) => ( + link: (item: DynamicSegmentItem) => ( {MailPoet.I18n.t('edit')} ), - display: (item) => !item.is_plugin_missing, + display: (item: DynamicSegmentItem) => !item.is_plugin_missing, }, { name: 'duplicate_segment', @@ -103,13 +133,13 @@ const itemActions = [ id: item.id, }, }) - .done((response) => { + .done((response: SegmentResponse) => { MailPoet.Notice.success( MailPoet.I18n.t('segmentDuplicated').replace( '%1$s', escapeHTML(response.data.name), - { scroll: true }, ), + { scroll: true }, ); refresh(); }) @@ -123,10 +153,10 @@ const itemActions = [ { name: 'edit_disabled', className: 'mailpoet-hide-on-mobile mailpoet-disabled', - link: (item) => ( + link: (item: DynamicSegmentItem) => ( {MailPoet.I18n.t('edit')} ), - display: (item) => item.is_plugin_missing, + display: (item: DynamicSegmentItem) => item.is_plugin_missing, }, { name: 'view_subscribers', @@ -148,7 +178,7 @@ const bulkActions = [ }, ]; -function renderItem(item, actions) { +function renderItem(item: DynamicSegmentItem, actions) { return ( <>