Display proper count in load more button

Co-authored-by: Andrew Watkins <andrew.watkinz@gmail.com>
Co-authored-by: Chris Henn <chris.henn@influxdata.com>

ui/src/ifql/components/TagListItem.tsx

@@ -256,6 +256,12 @@ export default class TagListItem extends PureComponent<Props, State> {
     }
   }
 
+  private get loadMoreCount(): number {
+    const {count, limit} = this.state
+
+    return Math.min(Math.abs(count - limit), explorer.TAG_VALUES_LIMIT)
+  }
+
   private get isFetchable(): boolean {
     const {isOpen, loadingAll} = this.state
 

ui/src/ifql/components/TagValueList.tsx

@@ -13,6 +13,7 @@ interface Props {
   isLoadingMoreValues: boolean
   onLoadMoreValues: () => void
   shouldShowMoreValues: boolean
+  loadMoreCount: number
 }
 
 export default class TagValueList extends PureComponent<Props> {
@@ -60,12 +61,12 @@ export default class TagValueList extends PureComponent<Props> {
   }
 
   private get buttonValue(): string | JSX.Element {
-    const {isLoadingMoreValues} = this.props
+    const {isLoadingMoreValues, loadMoreCount} = this.props
 
     if (isLoadingMoreValues) {
       return <LoadingSpinner />
     }
 
-    return `Load next ${explorer.TAG_VALUES_LIMIT} values`
+    return `Load next ${loadMoreCount} values`
   }
 }