diff --git a/turkle/static/turkle/action-table-2.4.21/action-table-filters.js b/turkle/static/turkle/action-table-2.4.21/action-table-filters.js
new file mode 100644
index 00000000..edb35d35
--- /dev/null
+++ b/turkle/static/turkle/action-table-2.4.21/action-table-filters.js
@@ -0,0 +1,5 @@
+var x=Object.defineProperty;var y=(g,p,e)=>p in g?x(g,p,{enumerable:!0,configurable:!0,writable:!0,value:e}):g[p]=e;var E=(g,p,e)=>(y(g,typeof p!="symbol"?p+"":p,e),e);class A extends HTMLElement{constructor(){super();E(this,"options",[])}findOptions(e){e=e.toLowerCase();const t=this.closest("action-table"),o=t.cols,n=t.tbody,s=o.findIndex(i=>i.name===e);if(s===-1)return;const h=`td:nth-child(${s+1})`,u=n.querySelectorAll(h);let a=[];Array.from(u).forEach(i=>{const l=i.querySelectorAll("span, ul > li");if(!i.dataset.filter&&(l==null?void 0:l.length)>0){const d=Array.from(l).map(f=>f.textContent||"");a=a.concat(d)}else a.push(t.getCellValues(i).filter)}),a=Array.from(new Set(a));const r=o[s].order;function c(i){return r!=null&&r.includes(i)?r.indexOf(i).toString():i}a.sort((i,l)=>(i=c(i),l=c(l),t.alphaNumSort(i,l))),this.hasAttribute("descending")&&a.reverse(),this.options=a}connectedCallback(){var t;const e=this.getAttribute("name");e&&(this.hasAttribute("options")?this.options=((t=this.getAttribute("options"))==null?void 0:t.split(","))||[]:this.findOptions(e),this.render(e))}render(e){if(this.options.length<1)return;const t=this.getAttribute("type")||"select";if(t!=="checkbox"&&this.options.length<2)return;const o=this.getAttribute("label")||e,n=this.hasAttribute("multiple")?"multiple":"",s=this.getAttribute("all")||"All";let h="",u="";const a=t==="select"?`<label for="filter-${e}">${o}</label>`:`<span class="filter-label">${o}</span>`;t==="select"&&(h=`<select id="filter-${e}" name="${e}" ${n}><option value="">${s}</option>`,u="</select>"),t==="radio"&&(h=`<label><input name="${e}" type="radio" value="" checked>${s}</label>`);const r=`${a}${h}${this.options.map(c=>t==="select"?`<option value="${c}">${c}</option>`:t==="radio"||t==="checkbox"?`<label><input type="${t}" name="${e}" value="${c}" />${c}</label>`:"").join("")}${u}`;this.innerHTML=`${r}`}}customElements.define("action-table-filter-menu",A);class L extends HTMLElement{connectedCallback(){const p=this.getAttribute("name");p&&(this.innerHTML=`<label>
+            <input type="checkbox" name="${p.toLowerCase()}" value="${this.getAttribute("value")||"on"}" />
+            <span>${this.getAttribute("label")||p}</span>
+          </label>`)}}customElements.define("action-table-filter-switch",L);class T extends HTMLElement{constructor(){super();E(this,"min",0);E(this,"rangeTotal",0);this.render(),this.addEventListeners()}get name(){return this.getAttribute("name")||""}addEventListeners(){this.addEventListener("input",e=>{const t=this.querySelectorAll("input"),o=this.querySelector("output"),[n,s]=Array.from(t).map(r=>Number(r.value)),h=n.toString(),u=s.toString();o instanceof HTMLOutputElement&&(o.textContent=`${h}-${u}`);const a=this.querySelector(".range-slider-highlight");a instanceof HTMLSpanElement&&(a.style.marginLeft=`${(n-this.min)/this.rangeTotal*100}%`,a.style.width=`${(s-n)/this.rangeTotal*100}%`),n>s&&(e.stopPropagation(),t[0].value=u,t[1].value=h)})}findMinMax(){const e=this.getAttribute("min"),t=this.getAttribute("max");if(e&&t)return[Number(e),Number(t)];const o=this.closest("action-table"),n=o.cols,s=o.tbody,h=n.findIndex(r=>r.name===this.name.toLowerCase());if(h===-1)return[0,0];const u=`td:nth-child(${h+1})`,a=s.querySelectorAll(u);return Array.from(a).reduce((r,c)=>{const i=Number(o.getCellValues(c).filter);let l=r.length===2?r[0]:i,d=r.length===2?r[1]:i;return l=l<i?l:i,d=d>i?d:i,[l,d]},[])}render(){const[e,t]=this.findMinMax(),o=e.toString(),n=t.toString();this.rangeTotal=t-e,this.min=e;const s=this.getAttribute("label")||this.name,h=document.createElement("div");h.textContent=s;const u=document.createElement("div");u.classList.add("range-slider-group");const a=Math.pow(10,Math.round(Math.log10(this.rangeTotal)))/10;function r(m,b){for(const v in b)m.setAttribute(v,b[v])}const c=[e];for(let m=e+a;m<=t;m+=a)c.push(Math.round(m/a)*a);c.includes(t)||c.push(t);const i=document.createElementNS("http://www.w3.org/2000/svg","svg");r(i,{role:"presentation",width:"100%",height:"5"});const l=100/(c.length-1);for(let m=1;m<c.length-1;m++){const b=document.createElementNS("http://www.w3.org/2000/svg","line"),v=`${m*l}%`;r(b,{x1:v,x2:v,y1:"0",y2:"5",stroke:"currentColor","stroke-width":"1"}),i.append(b)}const d=document.createElement("span");d.classList.add("range-slider-highlight"),u.append(i,d);for(let m=0;m<=1;m++){const b=document.createElement("input");r(b,{type:"range",name:this.name,min:o,max:n,"data-range":m===0?"min":"max","aria-label":m===0?"Min":"Max",value:m===0?o:n}),u.append(b)}const f=document.createElement("output");f.innerHTML=`${e}&ndash;${t}`,this.append(h,u,f)}}customElements.define("action-table-filter-range",T);class $ extends HTMLElement{constructor(){super();E(this,"actionTable",this.closest("action-table"));E(this,"resetButton",this.querySelector("button[type=reset]"));this.addEventListeners()}connectedCallback(){const e=this.actionTable.filters;Object.keys(e).length>0&&this.setFilterElements(e)}toggleHighlight(e){e.value?e.classList.add("selected"):e.classList.remove("selected")}addEventListeners(){var o;const e=(n,s)=>n.hasAttribute(s)||!!n.closest(`[${s}]`);this.addEventListener("input",n=>{const s=n.target;if(s instanceof HTMLSelectElement||s instanceof HTMLInputElement){const h=e(s,"exclusive"),u=e(s,"regex"),a=e(s,"exact"),r=s.dataset.cols?s.dataset.cols.toLowerCase().split(","):void 0,c=s.name.toLowerCase();if(s instanceof HTMLSelectElement){this.toggleHighlight(s);const i=Array.from(s.selectedOptions).map(l=>l.value);this.dispatch({[c]:{values:i,exclusive:h,regex:u,exact:a,cols:r}})}if(s instanceof HTMLInputElement){if(s.type==="checkbox"){const i=this.querySelectorAll("input[type=checkbox][name="+s.name+"]"),l=Array.from(i).filter(d=>d.checked).map(d=>d.value);this.dispatch({[c]:{values:l,exclusive:h,regex:u,exact:a,cols:r}})}if(s.type==="radio"&&this.dispatch({[c]:{values:[s.value],exclusive:h,regex:u,exact:a,cols:r}}),s.type==="range"){const i=this.querySelectorAll("input[type=range][name='"+s.name+"']");let l=[];const d=[];i.forEach(f=>{f.dataset.range==="min"&&(d[0]=f.min,l[0]=f.value),f.dataset.range==="max"&&(d[1]=f.max,l[1]=f.value)}),l.every((f,m)=>f===d[m])&&(l=[]),this.dispatch({[c]:{values:l,range:!0}})}}}}),this.querySelectorAll("input[type='search']").forEach(n=>{function s(u,a=300){let r;return(...c)=>{clearTimeout(r),r=setTimeout(()=>{u(...c)},a)}}const h=n.dataset.event||"input";n.addEventListener(h,()=>{this.toggleHighlight(n);const u=e(n,"exclusive"),a=e(n,"regex"),r=e(n,"exact"),c=n.dataset.cols?n.dataset.cols.toLowerCase().split(","):void 0;s(()=>this.dispatch({[n.name]:{values:[n.value],exclusive:u,regex:a,exact:r,cols:c}}))()})}),(o=this.resetButton)==null||o.addEventListener("click",()=>{this.resetAllFilterElements(),this.dispatch()}),this.actionTable.addEventListener("action-table-filters-reset",()=>{this.resetAllFilterElements()})}dispatchInput(e){e.dispatchEvent(new Event("input",{bubbles:!0}))}dispatch(e){if(this.resetButton)if(e){let t=this.actionTable.filters||{};t={...t,...e},this.enableReset(this.hasFilters(t))}else this.enableReset(!1);this.dispatchEvent(new CustomEvent("action-table-filter",{detail:e,bubbles:!0}))}enableReset(e=!0){this.resetButton&&(e?this.resetButton.removeAttribute("disabled"):this.resetButton.setAttribute("disabled",""))}hasFilters(e){return Object.keys(e).some(t=>e[t].values.some(o=>o!==""))}resetAllFilterElements(){this.querySelectorAll("select, input").forEach(t=>{t instanceof HTMLInputElement&&(t.type==="checkbox"||t.type==="radio")&&(t.value===""?t.checked=!0:t.checked=!1),(t instanceof HTMLSelectElement||t instanceof HTMLInputElement&&t.type==="search")&&(t.value="",this.toggleHighlight(t)),t instanceof HTMLInputElement&&t.type==="range"&&(t.value=t.dataset.range==="max"?t.max:t.min,this.dispatchInput(t))})}setFilterElements(e){this.hasFilters(e)?(this.enableReset(),Object.keys(e).forEach(t=>this.setFilterElement(t,e[t].values))):this.resetAllFilterElements()}setSelectValueIgnoringCase(e,t){t=t.toLowerCase(),Array.from(e.options).some(o=>(o.value.toLowerCase()||o.text.toLowerCase())===t?(o.selected=!0,this.toggleHighlight(e),!0):!1)}setFilterElement(e,t){if(t.length===0)return;this.querySelectorAll(`select[name="${e}" i], input[name="${e}" i]`).forEach(n=>{n instanceof HTMLSelectElement&&(n.value=t[0],this.setSelectValueIgnoringCase(n,t[0])),n instanceof HTMLInputElement&&(n.type==="checkbox"&&t.includes(n.value)&&(n.checked=!0),n.type==="radio"&&n.value===t[0]&&(n.checked=!0),n.type==="search"&&(n.value=t[0],this.toggleHighlight(n)),n.type==="range"&&(n.dataset.range==="min"&&(n.value=t[0]||n.min,this.dispatchInput(n)),n.dataset.range==="max"&&(n.value=t[1]||n.max,this.dispatchInput(n))))})}}customElements.define("action-table-filters",$);
+//# sourceMappingURL=action-table-filters.js.map
diff --git a/turkle/static/turkle/action-table-2.4.21/action-table-pagination.js b/turkle/static/turkle/action-table-2.4.21/action-table-pagination.js
new file mode 100644
index 00000000..d3992799
--- /dev/null
+++ b/turkle/static/turkle/action-table-2.4.21/action-table-pagination.js
@@ -0,0 +1,2 @@
+var f=Object.defineProperty;var d=(r,a,s)=>a in r?f(r,a,{enumerable:!0,configurable:!0,writable:!0,value:s}):r[a]=s;var c=(r,a,s)=>(d(r,typeof a!="symbol"?a+"":a,s),s);class m extends HTMLElement{constructor(){super();const a=this.closest("action-table"),{pagination:s}=a,t=i=>i.map(e=>`<option ${s===e?"selected":""}>${e}</option>`).join(""),n=this.options.length>0?`<label class="pagination-select"><span>${this.getAttribute("label")||"Rows per:"}</span> <select>${t(this.options)}</select></label>`:"";this.innerHTML=n,this.addEventListener("change",i=>{if(i.target instanceof HTMLSelectElement){const e=Number(i.target.value);isNaN(e)||(a.pagination=e)}})}get options(){const a=this.getAttribute("options");if(a){const s=a.split(",").map(t=>Number(t)).filter(t=>!isNaN(t));if(s.length>0)return s}return[]}}customElements.define("action-table-pagination-options",m);class $ extends HTMLElement{constructor(){super();c(this,"page",1);c(this,"numberOfPages",1);c(this,"group",1);c(this,"maxGroups",1);c(this,"actionTable",this.closest("action-table"));c(this,"rowsVisible",0);this.addEventListeners()}connectedCallback(){this.render()}render(){const{page:s,numberOfPages:t}=this.actionTable;this.numberOfPages=t,this.page=s;const n=Number(this.getAttribute("max-buttons"))||10,i=Math.ceil(t/n);let e=this.group;e>i?e=i:e<1&&(e=1);const l=(e-1)*n+1;function p(o,b="",h){return`<button type="button" class="${s===o?`active ${b}`:`${b}`}" data-page="${o}" title="${b}">${h||o}</button>`}let g="";if(e>1&&(g+=`${p(1,"first")}${p(l-1,"prev","...")}`),t>0){for(let o=l;o<=t;o++)if(g+=p(o),o!==t&&o>=n*e){g+=`${p(o+1,"next","...")}${p(t,"last")}`;break}}const u=o=>` class="pagination-${o}"`;this.innerHTML=`<span${u("label")}></span> <span${u("buttons")}>${g}</span>`,this.changeLabel(s),this.group=e,this.maxGroups=i}changeLabel(s){const{pagination:t,rowsSet:n}=this.actionTable;this.rowsVisible=n.size;const e=(this.getAttribute("label")||"Showing {rows} of {total}:").replace("{rows}",`${s*t-t+1}-${s*t}`).replace("{total}",`${n.size}`),l=this.querySelector("span.pagination-label");l&&(l.textContent=e)}addEventListeners(){this.addEventListener("click",s=>{const t=s.target;if(t instanceof HTMLButtonElement){let n=1;t.dataset.page&&(n=Number(t.dataset.page),t.classList.add("active"),this.querySelectorAll("button").forEach(l=>{l!==t&&l.classList.remove("active")}));let i=this.group;const e=l=>t.classList.contains(l);e("next")&&i++,e("prev")&&i--,e("first")&&(i=1),e("last")&&(i=this.maxGroups),this.actionTable.page=this.page=n,this.changeLabel(n),this.group!==i&&(this.group=i,this.render())}}),this.actionTable.addEventListener("action-table",s=>{const{page:t,pagination:n,numberOfPages:i,rowsVisible:e}=s.detail;(t&&t!==this.page||i!==void 0&&i!==this.numberOfPages||n!==void 0||e!==this.rowsVisible)&&this.render()})}}customElements.define("action-table-pagination",$);
+//# sourceMappingURL=action-table-pagination.js.map
diff --git a/turkle/static/turkle/action-table-2.4.21/action-table.css b/turkle/static/turkle/action-table-2.4.21/action-table.css
new file mode 100644
index 00000000..8c414111
--- /dev/null
+++ b/turkle/static/turkle/action-table-2.4.21/action-table.css
@@ -0,0 +1 @@
+action-table{display:block;--highlight: paleturquoise;--focus: dodgerblue;--star-checked: orange;--star-unchecked: gray;--switch-checked: green;--switch-unchecked: lightgray;--border: 1px solid lightgray;--border-radius: .2em;--th-bg: whitesmoke;--th-sorted: rgb(244, 220, 188);--col-sorted: rgb(255, 253, 240);--td-options-bg: whitesmoke;--page-btn: whitesmoke;--page-btn-active: rgb(244, 220, 188);--responsive-scroll-gradient: linear-gradient(to right, #fff 30%, rgba(255, 255, 255, 0)), linear-gradient(to right, rgba(255, 255, 255, 0), #fff 70%) 0 100%, radial-gradient(farthest-side at 0% 50%, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%}action-table :where(table){border-collapse:collapse;margin:1em 0;max-width:100%;overflow:auto;display:block;background:var(--responsive-scroll-gradient);background-repeat:no-repeat;background-size:40px 100%,40px 100%,14px 100%,14px 100%;background-position:0 0,100%,0 0,100%;background-attachment:local,local,scroll,scroll}action-table :where(th){border:var(--border);padding:0;text-align:left;background:var(--th-bg)}action-table :where(th[no-sort]){padding:.2em .5em}action-table :where(th button){cursor:pointer;font-weight:700;border:0;width:100%;height:100%;display:block;padding:.2em 1.5em .2em .5em;background-color:transparent;position:relative;text-align:left;font-size:inherit;line-height:inherit}action-table :where(th button:hover,th:has(button):hover,th button:focus,th:has(button):focus){background-color:var(--highlight)}action-table :where(th button):after{content:"";background-image:url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='M9 16.172l-6.071-6.071-1.414 1.414 8.485 8.485 8.485-8.485-1.414-1.414-6.071 6.071v-16.172h-2z'%3E%3C/path%3E%3C/svg%3E%0A");background-repeat:no-repeat;background-position:center right;background-size:.7em;height:.7em;width:.7em;display:block;opacity:.2;position:absolute;right:.4em;top:50%;transform:translateY(-50%);float:right;transition:transform .3s ease-in-out,opacity .3s ease-in-out}action-table :where(th[aria-sort$=ing] button,th[aria-sort$=ing]:has(button)){background-color:var(--th-sorted)}action-table :where(th[aria-sort$=ing] button):after{opacity:1}action-table :where(th[aria-sort=descending] button):after{opacity:1;transform:translateY(-50%) rotate(180deg)}action-table :where(td){border:var(--border);padding:.2em .4em}action-table .sorted{background-color:var(--col-sorted)}action-table :where(td span){background-color:var(--td-options-bg);padding:0 .4em .1em;margin:0 .2em}action-table:not(:defined),action-table-filters:not(:defined){visibility:hidden}action-table :where(select,input,button){font-size:inherit}action-table :where(input[type=search],select){border:var(--border);border-radius:var(--border-radius)}action-table .selected{background-color:var(--highlight);transition:color .2s ease}action-table .no-results :where(td){padding:1em;text-align:center}action-table :where(button){cursor:pointer}action-table-filter-menu,action-table-filter-switch label,action-table-filter-menu .filter-label{display:inline-flex;flex-wrap:wrap;align-items:center}action-table-filter-menu label,action-table-filter-menu .filter-label{margin-inline-end:.3em}action-table .switch label{display:inline-flex;align-items:center;margin:0}action-table .switch input{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;display:inline-block;background:var(--switch-unchecked);cursor:pointer;height:1.4em;width:2.75em;vertical-align:middle;border-radius:2em;box-shadow:0 1px 3px #0003 inset;transition:.25s linear background}action-table .switch input:before{content:"";display:block;width:1em;height:1em;background:#fff;border-radius:1em;position:absolute;top:.2em;left:.2em;box-shadow:0 1px 3px #0003;transition:.25s linear transform;transform:translate(0)}action-table .switch :checked{background:var(--switch-checked)}action-table .switch :checked:before{transform:translate(1.3em)}action-table .switch input:focus,action-table .star input:focus{outline:transparent}action-table .switch input:focus-visible,action-table .star input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}action-table .star input{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;cursor:pointer;height:1.6em;width:1.6em;vertical-align:middle;border-radius:.3em}action-table .star input:before{content:"";background:var(--star-unchecked);cursor:pointer;position:absolute;height:1.6em;width:1.6em;vertical-align:middle;transition:.25s linear background;clip-path:polygon(50% 0%,62% 29%,98% 35%,74% 58%,79% 91%,50% 76%,21% 91%,26% 58%,2% 35%,34% 29%)}action-table .star input:checked:before{background:var(--star-checked)}action-table-pagination{display:flex;justify-content:start;align-items:center;flex-wrap:wrap;gap:.6em;max-width:100%;overflow:auto}action-table-pagination .pagination-buttons{display:flex;justify-content:start;align-items:center;gap:.3em}action-table-pagination button{cursor:pointer;font-size:inherit;background-color:var(--page-btn);border:0;border-radius:.3em;padding:.2em .5em}action-table-pagination button:hover{background-color:var(--highlight)}action-table-pagination .active{font-weight:700;background-color:var(--page-btn-active)}@keyframes fade-in{0%{opacity:0}}@keyframes fade-out{to{opacity:0}}@keyframes slide-from-bottom{0%{transform:translateY(50px)}}@keyframes slide-to-top{to{transform:translateY(-50px)}}::view-transition-old(row){animation:90ms cubic-bezier(.4,0,1,1) both fade-out,.3s cubic-bezier(.4,0,.2,1) both slide-to-top}::view-transition-new(row){animation:1.21s cubic-bezier(0,0,.2,1) 90ms both fade-in,.3s cubic-bezier(.4,0,.2,1) both slide-from-bottom}action-table-filter-range{--thumb-size: 1.3em;--thumb-bg: #fff;--thumb-border: solid 2px #9e9e9e;--thumb-shadow: 0 1px 4px .5px rgba(0, 0, 0, .25);--thumb-highlight: var(--highlight);--track-bg: lightgray;--track-shadow: inset 0 0 2px #00000099;--track-highlight: var(--highlight);--ticks-color: #b2b2b2;--ticks-width: 1}action-table-filter-range,action-table-filter-range>div,action-table-filter-range label{display:flex;align-items:center;flex-wrap:wrap;gap:.6em}action-table-filter-range .range-slider-group{display:grid}action-table-filter-range .range-slider-group>*{grid-column:1;grid-row:1;position:relative}action-table-filter-range .range-slider-group:after{content:"";width:100%;height:.5em;background-color:var(--track-bg);border-radius:50px;background-size:100% 2px;box-shadow:var(--track-shadow);grid-column:1;grid-row:1;justify-self:center}action-table-filter-range .range-slider-highlight{background-color:var(--track-highlight);width:100%;height:.35em}action-table-filter-range input{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;width:100%;background:transparent;padding:.2em 0;pointer-events:none;cursor:-webkit-grab;cursor:grab}action-table-filter-range input::-webkit-slider-runnable-track{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent}action-table-filter-range input::-webkit-slider-thumb{-webkit-appearance:none;height:var(--thumb-size);width:var(--thumb-size);border-radius:50%;background:var(--thumb-bg);border:var(--thumb-border);box-shadow:var(--thumb-shadow);pointer-events:auto}action-table-filter-range input::-moz-range-thumb{-webkit-appearance:none;height:var(--thumb-size);width:var(--thumb-size);background:var(--thumb-bg);border-radius:50%;border:var(--thumb-border);box-shadow:var(--thumb-shadow);pointer-events:auto}action-table-filter-range input::-ms-thumb{-webkit-appearance:none;height:var(--thumb-size);width:var(--thumb-size);background:var(--thumb-bg);border-radius:50%;border:var(--thumb-border);box-shadow:var(--thumb-shadow);pointer-events:auto}action-table-filter-range input::-webkit-slider-thumb:hover{background:var(--thumb-highlight)}action-table-filter-range svg{color:var(--ticks-color);position:relative;top:-.6em;width:calc(100% - var(--thumb-size));justify-self:center;border-left:1px solid var(--ticks-color);border-right:1px solid var(--ticks-color);box-sizing:border-box}
diff --git a/turkle/static/turkle/action-table-2.4.21/action-table.js b/turkle/static/turkle/action-table-2.4.21/action-table.js
new file mode 100644
index 00000000..13426f43
--- /dev/null
+++ b/turkle/static/turkle/action-table-2.4.21/action-table.js
@@ -0,0 +1,2 @@
+var g=Object.defineProperty;var p=(c,l,t)=>l in c?g(c,l,{enumerable:!0,configurable:!0,writable:!0,value:t}):c[l]=t;var h=(c,l,t)=>(p(c,typeof l!="symbol"?l+"":l,t),t);class m extends HTMLElement{constructor(){super();const l=this.closest("action-table");this.style.display="none",this.addEventListener("click",t=>{t.target instanceof HTMLButtonElement&&t.target.type==="reset"&&(this.dispatchEvent(new CustomEvent("action-table-filter",{bubbles:!0})),this.dispatchEvent(new CustomEvent("action-table-filters-reset",{bubbles:!0})))}),l.addEventListener("action-table",t=>{const e=t.detail;(e==null?void 0:e.rowsVisible)===0?this.style.display="":this.style.display="none"})}}customElements.define("action-table-no-results",m);function y(c){return Object.keys(c).length>0}class C extends HTMLElement{constructor(){var t;super();h(this,"table");h(this,"tbody");h(this,"cols",[]);h(this,"rows",[]);h(this,"filters",{});h(this,"tableContent",new WeakMap);h(this,"rowsSet",new Set);h(this,"sortAndFilter",this.delayUntilNoLongerCalled(()=>{this.filterTable(),this.sortTable(),this.appendRows(),this.tbody.matches("[style*=none]")&&(this.rowsSet.size===0&&(this.setFilters(),this.dispatchEvent(new Event("action-table-filters-reset"))),this.tbody.style.display="")}));if(this.store){const e=this.getStore();e&&(this.sort=e.sort||this.sort,this.direction=e.direction||this.direction||"ascending",this.filters=e.filters||this.filters)}if(this.hasAttribute("urlparams")){const e=new URLSearchParams(window.location.search),s={};for(let[i,r]of e.entries())i=i.toLowerCase(),r=r.toLowerCase(),i!=="sort"&&i!=="direction"&&((t=s[i])!=null&&t.values?s[i].values.push(r):s[i]={values:[r]}),i==="sort"&&(this.sort=r),i==="direction"&&(r==="ascending"||r==="descending")&&(this.direction=r);Object.keys(s).length>0&&this.setFiltersObject(s)}this.addEventListeners()}get sort(){return this.getCleanAttr("sort")}set sort(t){this.setAttribute("sort",t)}get direction(){const t=this.getCleanAttr("direction");return t==="descending"?t:"ascending"}set direction(t){this.setAttribute("direction",t)}get store(){return this.hasAttribute("store")?this.getCleanAttr("store")||"action-table":""}get pagination(){return Number(this.getCleanAttr("pagination"))||0}set pagination(t){this.setAttribute("pagination",t.toString())}get page(){return Number(this.getCleanAttr("page"))||1}set page(t){t=this.checkPage(t),this.setAttribute("page",t.toString())}checkPage(t){return Math.max(1,Math.min(t,this.numberOfPages))}dispatch(t){this.dispatchEvent(new CustomEvent("action-table",{detail:t}))}getCleanAttr(t){var e;return((e=this.getAttribute(t))==null?void 0:e.trim().toLowerCase())||""}connectedCallback(){const t=this.querySelector("table");if(t&&t.querySelector("thead th")&&t.querySelector("tbody td"))this.table=t,this.tbody=t.querySelector("tbody"),this.rows=Array.from(this.tbody.querySelectorAll("tr")),this.rowsSet=new Set(this.rows);else throw new Error("Could not find table with thead and tbody");(this.sort||y(this.filters))&&(this.tbody.style.display="none",this.sortAndFilter()),this.getColumns(),this.addObserver()}static get observedAttributes(){return["sort","direction","pagination","page"]}attributeChangedCallback(t,e,s){e!==s&&this.rows.length>0&&((t==="sort"||t==="direction")&&this.sortTable(),t==="pagination"&&this.dispatch({pagination:this.pagination}),this.appendRows())}setFiltersObject(t={}){this.filters=t,this.store&&this.setStore({filters:this.filters})}setFilters(t={}){this.setFiltersObject(t),this.filterTable(),this.appendRows()}addEventListeners(){this.addEventListener("click",e=>{const s=e.target;if(s instanceof HTMLButtonElement&&s.dataset.col){const i=s.dataset.col;let r="ascending";this.sort===i&&this.direction==="ascending"&&(r="descending"),this.sort=i,this.direction=r,this.store&&this.setStore({sort:this.sort,direction:r})}},!1);const t=e=>e.matches("td")?e:e.closest("td");this.addEventListener("change",e=>{const s=e.target;s instanceof HTMLInputElement&&s.closest("td")&&s.type==="checkbox"&&this.updateCellValues(t(s))}),this.addEventListener("action-table-filter",e=>{if(e.detail){const s={...this.filters,...e.detail};Object.keys(s).forEach(i=>{s[i].values.every(r=>r==="")&&delete s[i]}),this.setFilters(s)}else this.setFilters()}),this.addEventListener("action-table-update",e=>{const s=e.target;if(s instanceof HTMLElement){let i={};typeof e.detail=="string"?i={sort:e.detail,filter:e.detail}:i=e.detail,this.updateCellValues(t(s),i)}})}getStore(){try{const t=localStorage.getItem(this.store),e=t&&JSON.parse(t);return typeof e=="object"&&e!==null&&["sort","direction","filters"].some(i=>i in e)?e:!1}catch{return!1}}setStore(t){const e=this.getStore()||{};e&&(t={...e,...t}),localStorage.setItem(this.store,JSON.stringify(t))}delayUntilNoLongerCalled(t){let e,s=!1;function i(){t(),s=!1}return function(){s?clearTimeout(e):s=!0,e=setTimeout(i,10)}}getColumns(){const t=this.table.querySelectorAll("thead th");if(t.forEach(e=>{const s=(e.dataset.col||this.getCellContent(e)).trim().toLowerCase(),i=e.dataset.order?e.dataset.order.split(","):void 0;if(this.cols.push({name:s,order:i}),!e.hasAttribute("no-sort")){const r=document.createElement("button");r.dataset.col=s,r.type="button",r.innerHTML=e.innerHTML,e.replaceChildren(r)}}),!this.table.querySelector("colgroup")){const e=document.createElement("colgroup");t.forEach(()=>{const s=document.createElement("col");e.appendChild(s)}),this.table.prepend(e)}}getCellContent(t){var s;let e=(t.textContent||"").trim();if(!e){const i=t.querySelector("svg");i instanceof SVGElement&&(e=((s=i.querySelector("title"))==null?void 0:s.textContent)||e);const r=t.querySelector("input[type=checkbox]");r instanceof HTMLInputElement&&r.checked&&(e=r.value);const n=t.querySelector(":defined");n!=null&&n.shadowRoot&&(e=n.shadowRoot.textContent||e)}return e.trim()}getCellValues(t){return this.tableContent.has(t)?this.tableContent.get(t):this.setCellValues(t)}setCellValues(t,e={}){const s=this.getCellContent(t),i={sort:t.dataset.sort||s,filter:t.dataset.filter||s,...e};return this.tableContent.set(t,i),i}updateCellValues(t,e={}){this.setCellValues(t,e),this.sortAndFilter()}addObserver(){new MutationObserver(e=>{e.forEach(s=>{let i=s.target;if(i.nodeType===3&&i.parentNode&&(i=i.parentNode),!(i instanceof HTMLElement))return;const r=i.closest("td");r instanceof HTMLTableCellElement&&(r.hasAttribute("contenteditable")&&r===document.activeElement?r.dataset.edit||(r.dataset.edit="true",r.addEventListener("blur",()=>{this.updateCellValues(r)})):this.updateCellValues(r))})}).observe(this.tbody,{childList:!0,subtree:!0,attributes:!0,characterData:!0,attributeFilter:["data-sort","data-filter"]})}filterTable(){const t=this.numberOfPages,e=this.rowsSet.size,s=this.filters["action-table"];this.rows.forEach(i=>{let r=!1;const n=i.querySelectorAll("td");if(s){const o=Array.from(n).filter((a,d)=>this.filters["action-table"].cols?this.filters["action-table"].cols.includes(this.cols[d].name.toLowerCase()):!0).map(a=>a.querySelector('input[type="checkbox"]')?"":this.getCellValues(a).filter).join(" ");this.shouldHide(s,o)&&(r=!0)}n.forEach((u,o)=>{const a=this.filters[this.cols[o].name];a&&this.shouldHide(a,this.getCellValues(u).filter)&&(r=!0)}),r?this.rowsSet.delete(i):this.rowsSet.add(i)}),this.numberOfPages!==t&&this.dispatch({numberOfPages:this.numberOfPages}),this.rowsSet.size!==e&&this.dispatch({rowsVisible:this.rowsSet.size})}shouldHide(t,e){if(t.values&&t.values.length>0){if(t.regex){let s=t.values.join("|");return t.exclusive&&(s=`${t.values.map(n=>`(?=.*${n})`).join("")}.*`),!new RegExp(s,"i").test(e)}if(t.range){const[s,i]=t.values;if(!isNaN(Number(s))&&!isNaN(Number(i)))return Number(e)<Number(s)||Number(e)>Number(i)}return t.exclusive?!t.values.every(s=>e.toLowerCase().includes(s.toLowerCase())):t.exact?t.values.every(s=>s&&s!==e):!t.values.some(s=>e.toLowerCase().includes(s.toLowerCase()))}return!1}sortTable(t=this.sort,e=this.direction){if(!this.sort||!e)return;t=t.toLowerCase();const s=this.cols.findIndex(i=>i.name===t);if(s>=0&&this.rows.length>0){const i=this.cols[s].order,r=o=>i!=null&&i.includes(o)?i.indexOf(o).toString():o;this.rows.sort((o,a)=>{if(e==="descending"){const b=o;o=a,a=b}const d=r(this.getCellValues(o.children[s]).sort),f=r(this.getCellValues(a.children[s]).sort);return this.alphaNumSort(d,f)}),this.querySelectorAll("col").forEach((o,a)=>{a===s?o.classList.add("sorted"):o.classList.remove("sorted")}),this.table.querySelectorAll("thead th").forEach((o,a)=>{const d=a===s?e:"none";o.setAttribute("aria-sort",d)})}}alphaNumSort(t,e){function s(n){if(isNaN(Number(n))){if(!isNaN(Date.parse(n)))return Date.parse(n)}else return Number(n)}const i=s(t),r=s(e);return i&&r?i-r:t.localeCompare(e)}appendRows(){const t=i=>{const{pagination:r,page:n}=this;return r===0||i>=r*(n-1)+1&&i<=r*n},e=document.createDocumentFragment();let s=0;if(this.rows.forEach(i=>{let r="none";this.rowsSet.has(i)&&(s++,t(s)&&(r="",e.appendChild(i))),i.style.display=r}),this.tbody.prepend(e),this.pagination>0){const i=this.checkPage(this.page);i!==this.page&&(this.page=i,this.dispatch({page:i}))}}get numberOfPages(){return this.pagination>0?Math.ceil(this.rowsSet.size/this.pagination):1}}customElements.define("action-table",C);
+//# sourceMappingURL=action-table.js.map
diff --git a/turkle/static/turkle/action-table-2.4.21/action_table_extension.css b/turkle/static/turkle/action-table-2.4.21/action_table_extension.css
new file mode 100644
index 00000000..eb7101ac
--- /dev/null
+++ b/turkle/static/turkle/action-table-2.4.21/action_table_extension.css
@@ -0,0 +1,104 @@
+/* fix action-table wdith */
+.table {
+  display: table
+}
+
+/* Custom styling for action-table-filters */
+action-table-filters {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 15px;
+  margin-bottom: 20px;
+  padding: 15px;
+  background-color: #f8f9fa;
+  border: 1px solid #dee2e6;
+  border-radius: 0.375rem;
+}
+
+action-table-filter-menu {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+action-table-filter-menu label {
+  margin: 0;
+  font-weight: 500;
+  color: #495057;
+  white-space: nowrap;
+}
+
+action-table-filter-menu select {
+  padding: 0.375rem 0.75rem;
+  border: 1px solid #ced4da;
+  border-radius: 0.25rem;
+  background-color: #fff;
+  color: #495057;
+  font-size: 0.875rem;
+  line-height: 1.5;
+  min-width: 120px;
+}
+
+action-table-filter-menu select:focus {
+  border-color: #80bdff;
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
+}
+
+action-table-filters > div {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+action-table-filters > div label {
+  margin: 0;
+  font-weight: 500;
+  color: #495057;
+  white-space: nowrap;
+}
+
+action-table-filters > div input {
+  padding: 0.375rem 0.75rem;
+  border: 1px solid #ced4da;
+  border-radius: 0.25rem;
+  background-color: #fff;
+  color: #495057;
+  font-size: 0.875rem;
+  line-height: 1.5;
+  min-width: 150px;
+}
+
+action-table-filters > div input:focus {
+  border-color: #80bdff;
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
+}
+
+action-table-filters > div input::placeholder {
+  color: #6c757d;
+  opacity: 1;
+}
+
+/* Responsive behavior */
+@media (max-width: 768px) {
+  action-table-filters {
+    flex-direction: column;
+    align-items: stretch;
+    gap: 10px;
+  }
+  
+  action-table-filter-menu,
+  action-table-filters > div {
+    flex-direction: column;
+    align-items: stretch;
+    gap: 5px;
+  }
+  
+  action-table-filter-menu select,
+  action-table-filters > div input {
+    min-width: auto;
+    width: 100%;
+  }
+}
diff --git a/turkle/static/turkle/action-table-2.4.21/action_table_extension.js b/turkle/static/turkle/action-table-2.4.21/action_table_extension.js
new file mode 100644
index 00000000..eba1535c
--- /dev/null
+++ b/turkle/static/turkle/action-table-2.4.21/action_table_extension.js
@@ -0,0 +1,77 @@
+document.addEventListener('DOMContentLoaded', function() {
+    const actionTableFilters = document.querySelector('action-table-filters');
+    
+    if (actionTableFilters) {
+        actionTableFilters.addEventListener('action-table-filter', function(event) {
+            const filterData = event.detail;
+            const url = new URL(window.location);
+            
+            // Process each filter in the event detail
+            Object.keys(filterData).forEach(filterKey => {
+                const filterInfo = filterData[filterKey];
+                
+                // First, remove any existing parameters with this key
+                url.searchParams.delete(filterKey);
+                
+                if (filterInfo && filterInfo.values && Array.isArray(filterInfo.values)) {
+                    // Filter out empty/null values
+                    const validValues = filterInfo.values.filter(value =>
+                        value !== null && value !== undefined && value.toString().trim() !== ''
+                    );
+                    
+                    // Add each valid value as a separate parameter
+                    validValues.forEach(value => {
+                        url.searchParams.append(filterKey, value);
+                    });
+                }
+            });
+            
+            // Update the URL without reloading the page
+            window.history.pushState({}, '', url.toString());
+        });
+    }
+
+    const actionTable = document.querySelector('action-table');
+        
+        if (actionTable) {
+          // Function to update URL parameters
+          function updateURLParams() {
+            const url = new URL(window.location);
+            const sort = actionTable.getAttribute('sort');
+            const direction = actionTable.getAttribute('direction');
+            
+            // Update or remove sort parameter
+            if (sort) {
+              url.searchParams.set('sort', sort);
+            } else {
+              url.searchParams.delete('sort');
+            }
+            
+            // Update or remove direction parameter
+            if (direction) {
+              url.searchParams.set('direction', direction);
+            } else {
+              url.searchParams.delete('direction');
+            }
+            
+            // Update browser history without reload
+            window.history.pushState({}, '', url.toString());
+          }
+          
+          // Create a MutationObserver to watch for attribute changes
+          const observer = new MutationObserver(function(mutations) {
+            mutations.forEach(function(mutation) {
+              if (mutation.type === 'attributes' &&
+                  (mutation.attributeName === 'sort' || mutation.attributeName === 'direction')) {
+                updateURLParams();
+              }
+            });
+          });
+          
+          // Start observing the action-table element for attribute changes
+          observer.observe(actionTable, {
+            attributes: true,
+            attributeFilter: ['sort', 'direction']
+          });
+        }
+});
diff --git a/turkle/static/turkle/action-table-2.4.21/index.js b/turkle/static/turkle/action-table-2.4.21/index.js
new file mode 100644
index 00000000..8fc2ad6d
--- /dev/null
+++ b/turkle/static/turkle/action-table-2.4.21/index.js
@@ -0,0 +1,2 @@
+import"./action-table.js";import"./action-table-filters.js";import"./action-table-pagination.js";
+//# sourceMappingURL=index.js.map
diff --git a/turkle/templates/turkle/index.html b/turkle/templates/turkle/index.html
index 06dd2a44..ec75c4cd 100644
--- a/turkle/templates/turkle/index.html
+++ b/turkle/templates/turkle/index.html
@@ -2,6 +2,10 @@
 {% load static %}
 
 {% block body %}
+<script type="module"  src="{% static 'turkle/action-table-2.4.21/index.js' %}"></script>
+<link rel="stylesheet"  href="{% static 'turkle/action-table-2.4.21/action-table.css' %}"/>
+<link rel="stylesheet" href="{% static 'turkle/action-table-2.4.21/action_table_extension.css' %}" />
+<script src="{% static 'turkle/action-table-2.4.21/action_table_extension.js' %}"></script>
 
 {% if abandoned_assignments %}
 <div class="container-fluid">
@@ -34,35 +38,45 @@
 
 <div class="container-fluid content mt-2">
   {% if batch_rows %}
-  <table class="table table-bordered table-hover">
-    <tr class="thead-dark">
-      <th>Project</th>
-      <th>Batch</th>
-      <th>Batch Published</th>
-      <th>Tasks Available</th>
-      <th></th>
-      <th></th>
-    </tr>
-    {% for batch_row in batch_rows %}
-    <tr>
-      <td>{{ batch_row.project_name }}</td>
-      <td>{{ batch_row.batch_name }}</td>
-      <td>{{ batch_row.batch_published }}</td>
-      <td>{{ batch_row.assignments_available }}</td>
-      <td>
-        <a href="{{ batch_row.preview_next_task_url }}" role="button" class="btn btn-sm btn-primary">
-          Preview next Task
-        </a>
-      </td>
-      <td>
-        <form method="post" action="{{ batch_row.accept_next_task_url }}">
-          {% csrf_token %}
-          <input type="submit" class="btn btn-sm btn-primary" value="Accept next Task" />
-        </form>
-      </td>
-    </tr>
-    {% endfor %}
-  </table>
+  <action-table urlparams>
+    <action-table-filters>
+      <action-table-filter-menu name="Project"></action-table-filter-menu>
+      <div><label for="batch-search">Search Batch</label> <input id="batch-search" name="batch" type="search" placeholder="Search" size="14"></div>
+    </action-table-filters>
+    <table class="table table-bordered table-hover">
+      <thead>
+        <tr>
+          <th>Project</th>
+          <th>Batch</th>
+          <th>Batch Published</th>
+          <th>Tasks Available</th>
+          <th no-sort></th>
+          <th no-sort></th>
+        </tr>
+      </thead>
+      <tbody>
+        {% for batch_row in batch_rows %}
+        <tr>
+          <td>{{ batch_row.project_name }}</td>
+          <td>{{ batch_row.batch_name }}</td>
+          <td>{{ batch_row.batch_published }}</td>
+          <td>{{ batch_row.assignments_available }}</td>
+          <td>
+            <a href="{{ batch_row.preview_next_task_url }}" role="button" class="btn btn-sm btn-primary">
+              Preview next Task
+            </a>
+          </td>
+          <td>
+            <form method="post" action="{{ batch_row.accept_next_task_url }}">
+              {% csrf_token %}
+              <input type="submit" class="btn btn-sm btn-primary" value="Accept next Task" />
+            </form>
+          </td>
+        </tr>
+        {% endfor %}
+      </tbody>
+    </table>
+  </action-table>
   {% else %}
   <h1>No Tasks available at this time</h1>
   {% if not user.is_authenticated  %}