Show number of days to a date in Search

One of the questions from last week in the PnP Modern Search repository was regarding showing the number of days to a review date (Handlebars helpers - extensibility library · microsoft-search/pnp-modern-search · Discussion #4433 )

Excellent question, and one where I did not have an answer already.

However, I had worked on a similar question in Comparing date with Today in Handlebars

The handle bar snippet below will give this result:

If the Review date (in this case mapped to RefinableDate16) is overdue the text will be in red.

If there is 30 days or less to the review date then the text background colour is yellow, and if the review date to more than 30 days in the future the text color is green.

The block in bold shows the number of days between the review date and today. Be aware that the diff is just that, the diff, and does not return -23 if the review date is 23 in the past, it just returns 23. That is one of the reasons why I have embedded the display of the numbers of days in the "less than" and "compare" structure.

{{#if (compare (dayDiff (getDate RefinableDate16 'YYYY-MMM-DD' ) (getDate (moment) 'YYYY-MMM-DD' )) "==" 0)}}
<span style= "background-color: yellow">
    Due TODAY

{{else}}
{{#lt (getDate RefinableDate16 'X') (moment 'X')}}

<span style= "color: Red">

    Days overdue: {{dayDiff (getDate RefinableDate16 'YYYY-MMM-DD' ) (getDate (moment) 'YYYY-MMM-DD' )}}

</span>

{{else}}



{{#compare (dayDiff (getDate RefinableDate16 'YYYY-MMM-DD' ) (getDate (moment) 'YYYY-MMM-DD' )) "==" 0 }}


<span style= "background-color: yellow">

    Days to next review: {{dayDiff (getDate RefinableDate16 'YYYY-MMM-DD' ) (getDate (moment) 'YYYY-MMM-DD' )}}

</span>


{{else}}

<span style= "color: green">

    Days to next review: {{dayDiff (getDate RefinableDate16 'YYYY-MMM-DD' ) (getDate (moment) 'YYYY-MMM-DD' )}}

</span>

{{/compare}}


{{/lt}}
{{/if}}

If you figure out how to do something similar in the Card or List layout, please blog about it or add it to the PnP Modern Search Layouts repository