'use strict';

import React, { useCallback, useMemo, useRef, useState, memo } from 'react';
import { createRoot } from 'react-dom/client';
import { AgGridReact } from 'ag-grid-react';
import 'ag-grid-community/styles/ag-grid.css';
import 'ag-grid-community/styles/ag-theme-alpine.css';
import NumberFloatingFilterComponent from './numberFloatingFilterComponent.jsx';
import CustomDateFloatingFilter from './CustomDateFloatingFilter.jsx';

const GridExample = () => {
  const containerStyle = useMemo(() => ({ width: '100%', height: '100%' }), []);
  const gridStyle = useMemo(() => ({ height: '100%', width: '100%' }), []);
  const [rowData, setRowData] = useState();

  const [columnDefs, setColumnDefs] = useState([
    { field: 'athlete', filter: false },
    {
      field: 'gold',
      filter: 'agNumberColumnFilter',
      suppressMenu: true,
      floatingFilterComponent: NumberFloatingFilterComponent,
      floatingFilterComponentParams: {
        suppressFilterButton: true,
        color: 'red',
      },
    },
    {
      field: 'date',
				filter: 'agDateColumnFilter',
      suppressMenu: true,
      filterParams: {
        filterOptions: [
          'none',
          {
            displayKey: 'today',
            displayName: 'TODAY',
            numberOfInputs: 0,
            predicate: (_, cellValue) => {
              const todayDate = new Date();
              return cellValue != null &&
              cellValue === `${todayDate.getDate().toString().padStart(2, 0)}/${(todayDate.getMonth + 1).toString().padStart(2, 0)}/${todayDate.getFullYear()}`
          }
          },
          'inRange',
        ],
        maxNumConditions: 1, // Important, otherwise it will add more conditions on each selection
      },
      // has the issue:
      //floatingFilterComponent: memo(CustomDateFloatingFilter),
      // Doesn't have the issue:
      floatingFilterComponent: CustomDateFloatingFilter,
    },
  ]);
  const defaultColDef = useMemo(() => {
    return {
      editable: true,
      sortable: true,
      flex: 1,
      minWidth: 100,
      filter: true,
      floatingFilter: true,
      resizable: true,
    };
  }, []);

  const onGridReady = useCallback((params) => {
    fetch('https://www.ag-grid.com/example-assets/olympic-winners.json')
      .then((resp) => resp.json())
      .then((data) => {
        setRowData(data);
      });
  }, []);

  return (
    <div style={containerStyle}>
      <div style={gridStyle} className="ag-theme-alpine">
        <AgGridReact
          rowData={rowData}
          columnDefs={columnDefs}
          defaultColDef={defaultColDef}
          onGridReady={onGridReady}
        ></AgGridReact>
      </div>
    </div>
  );
};

const root = createRoot(document.getElementById('root'));
root.render(<GridExample />);
import React, {
  Fragment,
  forwardRef,
  useImperativeHandle,
  useRef,
  useState,
} from 'react';

export default forwardRef((props, ref) => {
  const [currentValue, setCurrentValue] = useState(null);
  const inputRef = useRef(null);

  // expose AG Grid Filter Lifecycle callbacks
  useImperativeHandle(ref, () => {
    return {
      onParentModelChanged(parentModel) {
        // When the filter is empty we will receive a null value here
        if (!parentModel) {
          inputRef.current.value = '';
          setCurrentValue(null);
        } else {
          inputRef.current.value = parentModel.filter + '';
          setCurrentValue(parentModel.filter);
        }
      },
    };
  });

  const onInputBoxChanged = (input) => {
    if (input.target.value === '') {
      // Remove the filter
      props.parentFilterInstance((instance) => {
        instance.onFloatingFilterChanged(null, null);
      });
      return;
    }

    setCurrentValue(Number(input.target.value));
    props.parentFilterInstance((instance) => {
      instance.onFloatingFilterChanged('greaterThan', input.target.value);
    });
  };

  const style = {
    color: props.color,
    width: '30px',
  };

  return (
    <Fragment>
      &gt;{' '}
      <input
        ref={inputRef}
        style={style}
        type="number"
        min="0"
        onInput={onInputBoxChanged}
      />
    </Fragment>
  );
});
(function (global) {
    System.config({
        transpiler: 'plugin-babel',
        defaultExtension: 'js',
        paths:
                {
                    // paths serve as alias
                    "npm:": "https://cdn.jsdelivr.net/npm/",
            ...systemJsPaths
        },
        map: {
            css: boilerplatePath + "css.js",

            // babel transpiler
            'plugin-babel': 'npm:systemjs-plugin-babel@0.0.25/plugin-babel.js',
            'systemjs-babel-build': 'npm:systemjs-plugin-babel@0.0.25/systemjs-babel-browser.js',

            // react
            react: 'npm:react@18.2.0',
            'react-dom': 'npm:react-dom@18.2.0',
            'react-dom/client': 'npm:react-dom@18.2.0',
            redux: 'npm:redux@4.2.1',
            'react-redux': 'npm:react-redux@8.0.5',
            'prop-types': 'npm:prop-types@15.8.1',

            app: appLocation + 'app',
            // systemJsMap comes from index.html
            ...systemJsMap
        },
        packages: {
            react: {
                main: './umd/react.profiling.min.js'
            },
            'react-dom': {
                main: './umd/react-dom.profiling.min.js'
            },
            'react-dom/server': {
                main: '../umd/react-dom-server.browser.production.min.js'
            },
            redux: {
                main: './dist/redux.min.js',
                defaultExtension: 'js'
            },
            'react-redux': {
                main: './dist/react-redux.min.js',
                defaultExtension: 'js'
            },
            'prop-types': {
                main: './prop-types.min.js',
                defaultExtension: 'js',
            },

            app: {
                defaultExtension: 'jsx'
            },
            'ag-grid-react': {
                main: './main.js',
                defaultExtension: 'js'
            },
            'ag-grid-community': {
                main: './dist/ag-grid-community.cjs.min.js',
                defaultExtension: 'js'
            },
            'ag-grid-enterprise': {
                main: './dist/ag-grid-enterprise.cjs.min.js',
                defaultExtension: 'js'
            },
            '@ag-grid-community/react': {
                main: './main.js',
                defaultExtension: 'js'
            }
        },
        meta: {
            '*.jsx': {
                babelOptions: {
                    react: true
                }
            },
            '*.css': { loader: 'css' }
        }
    });
})(this);

window.addEventListener('error', e => {
    console.error('ERROR', e.message, e.filename)
});
if (typeof window !== 'undefined') {
    var waitSeconds = 100;

    var head = document.getElementsByTagName('head')[0];

    var isWebkit = !!window.navigator.userAgent.match(/AppleWebKit\/([^ ;]*)/);
    var webkitLoadCheck = function(link, callback) {
        setTimeout(function() {
            for (var i = 0; i < document.styleSheets.length; i++) {
                var sheet = document.styleSheets[i];
                if (sheet.href == link.href)
                    return callback();
            }
            webkitLoadCheck(link, callback);
        }, 10);
    };

    var cssIsReloadable = function cssIsReloadable(links) {
        // Css loaded on the page initially should be skipped by the first
        // systemjs load, and marked for reload
        var reloadable = true;
        forEach(links, function(link) {
            if(!link.hasAttribute('data-systemjs-css')) {
                reloadable = false;
                link.setAttribute('data-systemjs-css', '');
            }
        });
        return reloadable;
    }

    var findExistingCSS = function findExistingCSS(url){
        // Search for existing link to reload
        var links = head.getElementsByTagName('link')
        return filter(links, function(link){ return link.href === url; });
    }

    var noop = function() {};

    var loadCSS = function(url, existingLinks) {
        const stylesUrl = url.includes("styles.css") || url.includes("style.css");
        return new Promise((outerResolve, outerReject) => {
            setTimeout(() => {
                new Promise(function(resolve, reject) {
                    var timeout = setTimeout(function() {
                        reject('Unable to load CSS');
                    }, waitSeconds * 1000);
                    var _callback = function(error) {
                        clearTimeout(timeout);
                        link.onload = link.onerror = noop;
                        setTimeout(function() {
                            if (error) {
                                reject(error);
                                outerReject(error)
                            } else {
                                resolve('');
                                outerResolve('');
                            }
                        }, 7);
                    };
                    var link = document.createElement('link');
                    link.type = 'text/css';
                    link.rel = 'stylesheet';
                    link.href = url;
                    link.setAttribute('data-systemjs-css', '');
                    if (!isWebkit) {
                        link.onload = function() {
                            _callback();
                        }
                    } else {
                        webkitLoadCheck(link, _callback);
                    }
                    link.onerror = function(event) {
                        _callback(event.error || new Error('Error loading CSS file.'));
                    };
                    if (existingLinks.length)
                        head.insertBefore(link, existingLinks[0]);
                    else
                        head.appendChild(link);
                })
                    // Remove the old link regardless of loading outcome
                    .then(function(result){
                        forEach(existingLinks, function(link){link.parentElement.removeChild(link);})
                        return result;
                    }, function(err){
                        forEach(existingLinks, function(link){link.parentElement.removeChild(link);})
                        throw err;
                    })
            }, stylesUrl ? 5 : 0)
        })
    };

    exports.fetch = function(load) {
        // dont reload styles loaded in the head
        var links = findExistingCSS(load.address);
        if(!cssIsReloadable(links))
            return '';
        return loadCSS(load.address, links);
    };
}
else {
    var builderPromise;
    function getBuilder(loader) {
        if (builderPromise)
            return builderPromise;

        return builderPromise = System['import']('./css-plugin-base.js', module.id)
            .then(function(CSSPluginBase) {
                return new CSSPluginBase(function compile(source, address) {
                    return {
                        css: source,
                        map: null,
                        moduleSource: null,
                        moduleFormat: null
                    };
                });
            });
    }

    exports.cssPlugin = true;
    exports.fetch = function(load, fetch) {
        if (!this.builder)
            return '';
        return fetch(load);
    };
    exports.translate = function(load, opts) {
        if (!this.builder)
            return '';
        var loader = this;
        return getBuilder(loader).then(function(builder) {
            return builder.translate.call(loader, load, opts);
        });
    };
    exports.instantiate = function(load, opts) {
        if (!this.builder)
            return;
        var loader = this;
        return getBuilder(loader).then(function(builder) {
            return builder.instantiate.call(loader, load, opts);
        });
    };
    exports.bundle = function(loads, compileOpts, outputOpts) {
        var loader = this;
        return getBuilder(loader).then(function(builder) {
            return builder.bundle.call(loader, loads, compileOpts, outputOpts);
        });
    };
    exports.listAssets = function(loads, opts) {
        var loader = this;
        return getBuilder(loader).then(function(builder) {
            return builder.listAssets.call(loader, loads, opts);
        });
    };
}

// Because IE8?
function filter(arrayLike, func) {
    var arr = []
    forEach(arrayLike, function(item){
        if(func(item))
            arr.push(item);
    });
    return arr;
}

// Because IE8?
function forEach(arrayLike, func){
    for (var i = 0; i < arrayLike.length; i++) {
        func(arrayLike[i])
    }
}
<!DOCTYPE html>
<html lang="en">
	<head>
		<title>React example</title>
		<meta charSet="UTF-8"/>
		<meta name="viewport" content="width=device-width, initial-scale=1"/>
		<style media="only screen">
            html, body, #root {
                height: 100%;
                width: 100%;
                margin: 0;
                box-sizing: border-box;
                -webkit-overflow-scrolling: touch;
            }

            html {
                position: absolute;
                top: 0;
                left: 0;
                padding: 0;
                overflow: auto;
            }

            body {
                padding: 1rem;
                overflow: auto;
            }
        </style>
	</head>
	<body>
		<div id="root">
		</div>
		<svg id="loading-spinner" style="position:absolute;top:50%;left:50%;transform:translate(-50%, -50%) scale(2)" class="logomark" width="64" height="48" viewBox="0 0 64 48">
			<style>
    .logomark .aqua {
        fill: #55b4c8;
    }

    .logomark .orange {
        fill: #ff8c00;
    }

    .logomark .red {
        fill: #f00;
    }

    .logomark .grey {
        fill: #b4bebe;
    }

    rect {
        animation-iteration-count: infinite;
        animation-timing-function: ease-in-out;
        animation-play-state: paused;
    }

    rect[class*=&#x27;right&#x27;] {
        animation-name: logo-mark-bounce-right;
        animation-duration: 1.25s;
        animation-play-state: running;
    }

    rect[class*=&#x27;left&#x27;] {
        animation-name: logo-mark-bounce-left;
        animation-duration: 1.25s;
        animation-play-state: running;
    }

    .right-2 {
        animation-delay: calc(1.25s / 6);
    }

    .right-3 {
        animation-delay: calc(1.25s / 6 * 2);
    }

    .left-3 {
        animation-delay: calc(1.25s / 6 * 3);
    }

    .left-2 {
        animation-delay: calc(1.25s / 6 * 4);
    }

    .left-1 {
        animation-delay: calc(1.25s / 6 * 5);
    }

    @keyframes logo-mark-bounce-right {
        0% {
        transform: translateX(0%);
        }

        16.6666% {
        transform: translateX(3px);
        }

        33.3333% {
        transform: translateX(0);
        }
    }

    @keyframes logo-mark-bounce-left {
        0% {
        transform: translateX(0%);
        }

        16.6666% {
        transform: translateX(-3px);
        }

        33.3333% {
        transform: translateX(0);
        }
    }
    </style>
			<rect class="aqua right-1" x="51" y="10" width="7" height="8">
			</rect>
			<path class="aqua right-1" d="M58,10l-17,0l-8,8l25,0l0,-8Z">
			</path>
			<rect class="orange right-2" x="36" y="22" width="7" height="8">
			</rect>
			<path class="orange right-2" d="M43,30l0,-7.995l-14,-0l-8.008,7.995l22.008,0Z">
			</path>
			<rect class="red right-3" x="24" y="34" width="7" height="8">
			</rect>
			<path class="red right-3" d="M13,38.01l4,-4.01l14,0l0,8l-18,0l0,-3.99Z">
			</path>
			<rect class="grey left-1" x="11" y="6" width="7" height="8">
			</rect>
			<path class="grey left-1" d="M41,10l-4,4l-26,0l0,-8l30,0l0,4Z">
			</path>
			<rect class="grey left-2" x="16" y="18" width="7" height="8">
			</rect>
			<path class="grey left-2" d="M16,26l9,0l8,-8l-17,-0l0,8Z">
			</path>
			<rect class="grey left-3" x="6" y="30" width="7" height="8">
			</rect>
			<path class="grey left-3" d="M6,37.988l7,0.012l7.992,-8l-14.992,-0.047l-0,8.035Z">
			</path>
		</svg>
		<script id="loading-script">const cleanupLoading = () => {
    if (document.querySelector('.ag-root-wrapper, .ag-chart-wrapper')) {
        document.querySelector('#loading-spinner').remove();
        document.querySelector('#loading-script').remove();
    } else {
        requestAnimationFrame(() => cleanupLoading());
    }
};

cleanupLoading();</script>
		<script>
            var appLocation = './';
            var boilerplatePath = '';
            var systemJsMap = {
                "@ag-grid-community/react": "https://cdn.jsdelivr.net/npm/@ag-grid-community/react@30.0.0/",
                "@ag-grid-community/styles": "https://cdn.jsdelivr.net/npm/@ag-grid-community/styles@30.0.0",
                "ag-grid-community": "https://cdn.jsdelivr.net/npm/ag-grid-community@30.0.0",
                "ag-grid-enterprise": "https://cdn.jsdelivr.net/npm/ag-grid-enterprise@30.0.0/",
                "ag-grid-react": "https://cdn.jsdelivr.net/npm/ag-grid-react@30.0.0/"
            };
            var systemJsPaths = {
                "@ag-grid-community/client-side-row-model": "https://cdn.jsdelivr.net/npm/@ag-grid-community/client-side-row-model@30.0.0/dist/client-side-row-model.cjs.min.js",
                "@ag-grid-community/core": "https://cdn.jsdelivr.net/npm/@ag-grid-community/core@30.0.0/dist/core.cjs.min.js",
                "@ag-grid-community/csv-export": "https://cdn.jsdelivr.net/npm/@ag-grid-community/csv-export@30.0.0/dist/csv-export.cjs.min.js",
                "@ag-grid-community/infinite-row-model": "https://cdn.jsdelivr.net/npm/@ag-grid-community/infinite-row-model@30.0.0/dist/infinite-row-model.cjs.min.js"
            };
        </script>
		<script src="https://cdn.jsdelivr.net/npm/systemjs@0.19.47/dist/system.js">
		</script>
		<script src="systemjs.config.js">
		</script>
		<script>System.import('./index.jsx').catch(function(err) { console.error(err); });</script>
	</body>
</html>
import React, {
  Fragment,
  forwardRef,
  useImperativeHandle,
  useRef,
  useState,
} from 'react';

export default forwardRef((props, ref) => {
  const [currentValue, setCurrentValue] = useState(null);
  const inputRef = useRef(null);

  // expose AG Grid Filter Lifecycle callbacks
  useImperativeHandle(ref, () => {
    return {
      onParentModelChanged(parentModel) {
        // When the filter is empty we will receive a null value here
        if (!parentModel) {
          //inputRef.current.value = '';
          setCurrentValue(null);
        } else {
          //inputRef.current.value = parentModel.filter + '';
          setCurrentValue(parentModel.type);
        }
      },
    };
  });
/*
  const onInputBoxChanged = (input) => {
    if (input.target.value === '') {
      // Remove the filter
      props.parentFilterInstance((instance) => {
        instance.onFloatingFilterChanged(null, null);
      });
      return;
    }

    setCurrentValue(Number(input.target.value));
    props.parentFilterInstance((instance) => {
      instance.onFloatingFilterChanged('greaterThan', input.target.value);
    });
  };
*/
  const style = {
    color: props.color,
    width: '30px',
  };

              const todayDate = new Date();
  return (
    <Fragment>
    {currentValue}
     {currentValue === 'today' && 
     `${todayDate.getDate().toString().padStart(2, 0)}/${(todayDate.getMonth() + 1).toString().padStart(2, 0)}/${todayDate.getFullYear()}`}
    </Fragment>
  );
});
import dayjs, { Dayjs } from 'dayjs';

import { Localization } from 'utils/i18n/i18n';

export type CustomDateFilterOption =
	| 'equals'
	| 'inRange'
	| 'today'
	| 'tomorrow'
	| 'yesterday'
	| 'after'
	| 'after!lastMeeting'
	| 'before'
	| 'before!nextMeeting'
	| `next${number}${OffsetType}`
	| `last${number}${OffsetType}`;

enum KnownSupportingInformation {
	lastMeeting = 'lastMeeting',
	nextMeeting = 'nextMeeting',
}

type OffsetType = 'days' | 'weeks' | 'months' | 'years';

type RangeLimitType =
	| 'equal'
	| 'beforeOrEqual'
	| 'afterOrEqual'
	| 'betweenThenAndNow';

function compareFilterRange(
	cellValue: Dayjs,
	limitDate: Dayjs,
	limitType: RangeLimitType,
): boolean {
	const VALUE = cellValue.format('YYYY-MM-DD');
	const LIMIT = limitDate.format('YYYY-MM-DD');
	const TODAY = dayjs().format('YYYY-MM-DD');
	switch (limitType) {
		case 'equal':
			return VALUE === LIMIT;
		case 'beforeOrEqual':
			return VALUE >= LIMIT;
		case 'afterOrEqual':
			return VALUE <= LIMIT;
		case 'betweenThenAndNow':
			if (TODAY <= LIMIT) {
				return VALUE >= TODAY && VALUE <= LIMIT;
			}
			return VALUE <= TODAY && VALUE >= LIMIT;
	}
}

function getDateRange(limitDate: Dayjs, limitType: RangeLimitType) {
	const LIMIT = limitDate.format('YYYY-MM-DD');
	const TODAY = dayjs().format('YYYY-MM-DD');
	switch (limitType) {
		case 'equal':
			return { dateFrom: LIMIT, dateTo: LIMIT };
		case 'beforeOrEqual':
			return {
				dateFrom: limitDate.add(-10, 'years').format('YYYY-MM-DD'),
				dateTo: LIMIT,
			};
		case 'afterOrEqual':
			return {
				dateFrom: LIMIT,
				dateTo: limitDate.add(10, 'years').format('YYYY-MM-DD'),
			};
		case 'betweenThenAndNow':
			if (TODAY <= LIMIT) {
				return { dateFrom: TODAY, dateTo: LIMIT };
			}
			return { dateFrom: LIMIT, dateTo: TODAY };
	}
}

export type CustomFilterOptionDescription = {
	displayKey: CustomDateFilterOption;
	displayName: string;
	numberOfInputs: number;
	predicate: (
		filterValues: Date[],
		cellValue: Date | undefined | null,
	) => boolean;
	descriptor: {
		type: CustomDateFilterOption;
		label: string;
		dateFrom?: string;
		dateTo?: string;
	};
};

export const getCustomDateFilterOption: Record<
	string,
	(
		formatMessage: Localization['formatMessage'],
		limitType?: RangeLimitType,
		offset?: number,
		offsetType?: OffsetType,
		knownDate?: Date,
	) => CustomFilterOptionDescription
> = {
	today: (formatMessage, limitType, _offset, _offsetType) => ({
		displayKey: 'today',
		displayName: formatMessage('filter.date.today'),
		numberOfInputs: 0,
		predicate: (_, cellValue) =>
			cellValue != null &&
			compareFilterRange(dayjs(cellValue), dayjs(), limitType ?? 'equal'),
		descriptor: {
			type: 'today',
			label: formatMessage('filter.date.today'),
			...getDateRange(dayjs(), limitType ?? 'equal'),
		},
	}),
	tomorrow: (formatMessage, limitType, _offset, _offsetType) => ({
		displayKey: 'tomorrow',
		displayName: formatMessage('filter.date.tomorrow'),
		numberOfInputs: 0,
		predicate: (_, cellValue) =>
			cellValue != null &&
			compareFilterRange(
				dayjs(cellValue),
				dayjs().add(1, 'days'),
				limitType ?? 'equal',
			),
		descriptor: {
			type: 'tomorrow',
			label: formatMessage('filter.date.tomorrow'),
			...getDateRange(dayjs().add(1, 'days'), limitType ?? 'equal'),
		},
	}),
	yesterday: (formatMessage, limitType, _offset, _offsetType) => ({
		displayKey: 'yesterday',
		displayName: formatMessage('filter.date.yesterday'),
		numberOfInputs: 0,
		predicate: (_, cellValue) =>
			cellValue != null &&
			compareFilterRange(
				dayjs(cellValue),
				dayjs().add(-1, 'days'),
				limitType ?? 'equal',
			),
		descriptor: {
			type: 'yesterday',
			label: formatMessage('filter.date.yesterday'),
			...getDateRange(dayjs().add(-1, 'days'), limitType ?? 'equal'),
		},
	}),
	next: (formatMessage, limitType, offset = 0, offsetType = 'days') => ({
		displayKey: `next${offset}${offsetType}`,
		displayName: formatMessage(`filter.dates.future.${offsetType}`, {
			count: offset,
		}),
		numberOfInputs: 0,
		predicate: (_, cellValue) =>
			cellValue != null &&
			compareFilterRange(
				dayjs(cellValue),
				dayjs().add(offset, offsetType),
				limitType ?? 'betweenThenAndNow',
			),
		descriptor: {
			type: `next${offset}${offsetType}`,
			label: formatMessage(`filter.dates.future.${offsetType}`, {
				count: offset,
			}),
			...getDateRange(
				dayjs().add(offset, offsetType),
				limitType ?? 'betweenThenAndNow',
			),
		},
	}),
	last: (formatMessage, limitType, offset = 0, offsetType = 'days') => ({
		displayKey: `last${offset}${offsetType}`,
		displayName: formatMessage(`filter.dates.past.${offsetType}`, {
			count: offset,
		}),
		numberOfInputs: 0,
		predicate: (_, cellValue) =>
			cellValue != null &&
			compareFilterRange(
				dayjs(cellValue),
				dayjs().add(-offset, offsetType),
				limitType ?? 'betweenThenAndNow',
			),
		descriptor: {
			type: `last${offset}${offsetType}`,
			label: formatMessage(`filter.dates.past.${offsetType}`, {
				count: offset,
			}),
			...getDateRange(
				dayjs().add(-offset, offsetType),
				limitType ?? 'betweenThenAndNow',
			),
		},
	}),
	beforeNextMeeting: (
		formatMessage,
		limitType,
		_offset,
		_offsetType,
		knownDate,
	) => ({
		displayKey: `before!nextMeeting`,
		displayName: formatMessage(`filter.beforeNextMeeting`),
		numberOfInputs: 0,
		predicate: (_, cellValue) =>
			cellValue != null &&
			compareFilterRange(
				dayjs(cellValue),
				dayjs(knownDate),
				limitType ?? 'betweenThenAndNow',
			),
		descriptor: {
			type: `before!nextMeeting`,
			label: formatMessage(`filter.beforeNextMeeting`),
			...getDateRange(dayjs(knownDate), limitType ?? 'betweenThenAndNow'),
		},
	}),
	afterLastMeeting: (
		formatMessage,
		limitType,
		_offset,
		_offsetType,
		knownDate,
	) => ({
		displayKey: `after!lastMeeting`,
		displayName: formatMessage(`filter.afterLastMeeting`),
		numberOfInputs: 0,
		predicate: (_, cellValue) =>
			cellValue != null &&
			compareFilterRange(
				dayjs(cellValue),
				dayjs(knownDate),
				limitType ?? 'betweenThenAndNow',
			),
		descriptor: {
			type: `after!lastMeeting`,
			label: formatMessage(`filter.afterLastMeeting`),
			...getDateRange(dayjs(knownDate), limitType ?? 'betweenThenAndNow'),
		},
	}),
};