Cache Policy Settings Block for React

Each cached path is given to the first rule, from the top, whose pattern covers it; a star in a pattern stands for any run of characters. The count on each rule is how many of the eight typed paths it was given, so the counts always add up to eight. Move the catch-all rule above the others and it takes every path, and the rules under it read "Shadowed by a rule above it". Moving a rule says where it went in the status line and keeps focus on the button you pressed (the other one when that button has nowhere to go).

How long a copy is served, on a log scale fitted to the longest rule, so ten seconds and a week both show. The solid part is the time a copy stays fresh and the lighter part is how long a stale copy may still be served while the cache refreshes it in the background; a rule with no stale window draws only the solid part. The bars are decoration: the same values are in the fields beside them, and the caption under the table says how to read them.

It takes the pattern in the field, counts the cached paths it covers that haven't been purged, and marks them in the list as you type. Purge matching, or Enter in the field, records them as purged in this page and says so; it is not part of the unsaved changes, and it refuses, with a message, when nothing matches. Nothing is cleared anywhere.

Edit the constants at the top. SAVED holds the rules in order, each with a stable id, its pattern, how long a copy stays fresh (ttl and its unit) and its stale window in seconds. UNITS and STALE fill the menus, and CACHED is the list of paths the counts and the purge are worked out against; replace it with the paths your cache really holds.

All of it: the cached paths are typed, and Save and Purge change only this page. To make it real, send the ordered rules to your edge configuration when saving, ask the edge for the paths a pattern would clear before purging, and call its purge endpoint from the button, showing a failure in the status line. Keep the order the server applies the same as the order shown.

Each rule becomes a card, with its pattern, count and bar on top, then the freshness field and unit, then the stale window beside the move buttons. Every control has its own name that includes the pattern ("Fresh for, /api/", "Move /api/ up"), and the table keeps real headers and a caption for a screen reader on a desktop. The foot stays pinned to the bottom of the screen at every width.