Release 2.1.1

CHANGELOG.md

@@ -1,6 +1,10 @@
 # Change Log
 All notable changes to this project will be documented in this file.
 
+## [v2.1.1] - 2025-03-26
+### Fixed
+- Filter bug in Chrome
+
 ## [v2.1.0] - 2025-03-25
 ### Added
 - Rewrited GUI in `SolidJS` and `TypeScript`

frontend/package.json

@@ -1,7 +1,7 @@
 {
   "name": "watchyourlan",
   "private": true,
-  "version": "2.1.0",
+  "version": "2.1.1",
   "type": "module",
   "scripts": {
     "dev": "vite",

frontend/src/components/Filter.tsx

@@ -4,31 +4,36 @@ import { filterFunc } from "../functions/filter";
 
 
 function Filter() {
+  type FilterEvent = Event & {
+    currentTarget: HTMLSelectElement;
+    target: HTMLSelectElement;
+  };
 
-  const handleFilter = (field: keyof Host, value: any) => {
-      filterFunc(field, value);
+  const handleFilter = (field: keyof Host, event: FilterEvent) => {
+    const value = event.target ? event.target.value : 0;
+    filterFunc(field, value);
   };
 
   return (
     <div class="row">
       <div class="col input-group">
-        <select class="form-select" title="Filter by Iface">
+        <select onChange={(event)=>{handleFilter("Iface", event)}} class="form-select" title="Filter by Iface">
           <option selected disabled>Iface</option>
           <For each={ifaces()}>{(iface) =>
-            <option onClick={()=>{handleFilter("Iface", iface)}}>{iface}</option>
+            <option value={iface}>{iface}</option>
           }</For>
         </select>
-        <select class="form-select" title="Filter by Known">
+        <select onChange={(event)=>{handleFilter("Known", event)}} class="form-select" title="Filter by Known">
           <option selected disabled>Known</option>
-          <option onClick={()=>{handleFilter("Known", 1)}}>Known</option>
-          <option onClick={()=>{handleFilter("Known", 0)}}>Unknown</option>
+          <option value={1}>Known</option>
+          <option value={0}>Unknown</option>
         </select>
-        <select class="form-select" title="Filter by Online">
+        <select onChange={(event)=>{handleFilter("Now", event)}} class="form-select" title="Filter by Online">
           <option selected disabled>Online</option>
-          <option onClick={()=>{handleFilter("Now", 1)}}>On</option>
-          <option onClick={()=>{handleFilter("Now", 0)}}>Off</option>
+          <option value={1}>On</option>
+          <option value={0}>Off</option>
         </select>
-        <button onClick={()=>{handleFilter("ID", 0)}} class="btn btn-outline-primary" title="Reset filter">Reset filter</button>
+        <button onClick={()=>{handleFilter("ID", new Event("") as FilterEvent)}} class="btn btn-outline-primary" title="Reset filter">Reset filter</button>
       </div>
     </div>
   )

frontend/src/components/HostPage/HostCard.tsx

@@ -1,4 +1,5 @@
 import { apiDelHost, apiEditHost } from "../../functions/api";
+import { getHosts } from "../../functions/atstart";
 
 function HostCard(_props: any) {
 
@@ -8,6 +9,7 @@ function HostCard(_props: any) {
     
     name = n;
     await apiEditHost(_props.host.ID, name, '');
+    getHosts();
   };
 
   const handleToggle = async () => {
@@ -17,6 +19,7 @@ function HostCard(_props: any) {
     }
 
     await apiEditHost(_props.host.ID, name, 'toggle');
+    getHosts();
   };
 
   const handleDel = async () => {

internal/web/public/assets/HistShow.js

@@ -1,4 +1,4 @@
-import{c as h,o as v,e as c,S as w,t as u,b as d,s as S,x as g,l as f,F as p,y,k as m,h as b}from"./index.js";var x=u("<i>");function $(o){const[r,t]=h([]);return v(async()=>{let e=[];e=await y(o.mac),e!=null&&(e.sort((s,a)=>s.Date<a.Date?1:-1),t(e))}),c(p,{get each(){return r()},children:(e,s)=>c(w,{get when(){return s()<f()},get children(){var a=x();return d(n=>{var l="Date:"+e.Date+`
+import{c as h,o as v,e as c,S as w,t as u,b as d,s as S,y as g,l as f,F as p,z as y,k as m,h as b}from"./index.js";var H=u("<i>");function x(o){const[r,t]=h([]);return v(async()=>{let e=[];e=await y(o.mac),e!=null&&(e.sort((s,a)=>s.Date<a.Date?1:-1),t(e))}),c(p,{get each(){return r()},children:(e,s)=>c(w,{get when(){return s()<f()},get children(){var a=H();return d(n=>{var l="Date:"+e.Date+`
 Iface:`+e.Iface+`
 IP:`+e.IP+`
-Known:`+e.Known,i=e.Now===0?"my-box-off":"my-box-on";return l!==n.e&&S(a,"title",n.e=l),i!==n.t&&g(a,n.t=i),n},{e:void 0,t:void 0}),a}})})}var H=u('<input class=form-control placeholder="Show elements"title="Nomber of elements to show"style=max-width:10em;>');function D(o){const r=t=>{localStorage.setItem(o.name,t),m(+t),f()==0&&m(200)};return(()=>{var t=H();return t.$$input=e=>r(e.target.value),t})()}b(["input"]);export{D as H,$ as M};
+Known:`+e.Known,i=e.Now===0?"my-box-off":"my-box-on";return l!==n.e&&S(a,"title",n.e=l),i!==n.t&&g(a,n.t=i),n},{e:void 0,t:void 0}),a}})})}var I=u('<input class=form-control placeholder="Show elements"title="Nomber of elements to show"style=max-width:10em;>');function D(o){const r=t=>{localStorage.setItem(o.name,t),m(+t),f()==0&&m(200)};return(()=>{var t=I();return t.$$input=e=>r(e.target.value),t})()}b(["input"]);export{D as H,x as M};

internal/web/public/assets/HostPage.js

@@ -1 +1 @@
-import{t as c,i as e,j as k,b as w,s as B,p as K,q as it,h as G,c as x,e as u,F as rt,r as nt,k as O,l as q,u as at,o as st,v as dt,w as ct}from"./index.js";import{H as ot,M as $t}from"./HistShow.js";var ht=c('<div class="card border-primary"><div class=card-header>Host</div><div class="card-body table-responsive"><table class="table table-striped table-hover"><tbody><tr><td>ID</td><td></td></tr><tr><td>Name</td><td><input type=text class=form-control></td></tr><tr><td>DNS name</td><td></td></tr><tr><td>Iface</td><td></td></tr><tr><td>IP</td><td><a target=_blank></a></td></tr><tr><td>MAC</td><td></td></tr><tr><td>Hardware</td><td></td></tr><tr><td>Date</td><td></td></tr><tr><td>Known</td><td><div class="form-check form-switch"><input class=form-check-input type=checkbox></div></td></tr><tr><td>Online</td><td></td></tr></tbody></table><button type=button class="btn btn-outline-danger">Delete host'),bt=c('<i class="bi bi-check-circle-fill"style=color:var(--bs-success);>'),ut=c('<i class="bi bi-circle-fill"style=color:var(--bs-gray-500);>');function ft(t){let i="";const r=async o=>{i=o,await K(t.host.ID,i,"")},l=async()=>{i==""&&(i=t.host.Name),await K(t.host.ID,i,"toggle")},h=async()=>{await it(t.host.ID),window.location.href="/"};return(()=>{var o=ht(),f=o.firstChild,p=f.nextSibling,g=p.firstChild,H=g.firstChild,_=H.firstChild,I=_.firstChild,a=I.nextSibling,s=_.nextSibling,b=s.firstChild,d=b.nextSibling,m=d.firstChild,v=s.nextSibling,N=v.firstChild,C=N.nextSibling,n=v.nextSibling,$=n.firstChild,y=$.nextSibling,S=n.nextSibling,L=S.firstChild,R=L.nextSibling,D=R.firstChild,M=S.nextSibling,T=M.firstChild,z=T.nextSibling,E=M.nextSibling,J=E.firstChild,Q=J.nextSibling,j=E.nextSibling,U=j.firstChild,V=U.nextSibling,F=j.nextSibling,W=F.firstChild,X=W.nextSibling,Y=X.firstChild,A=Y.firstChild,Z=F.nextSibling,tt=Z.firstChild,et=tt.nextSibling,lt=g.nextSibling;return e(a,()=>t.host.ID),m.$$input=P=>r(P.target.value),e(C,()=>t.host.DNS),e(y,()=>t.host.Iface),e(D,()=>t.host.IP),e(z,()=>t.host.Mac),e(Q,()=>t.host.Hw),e(V,()=>t.host.Date),A.$$click=l,e(et,(()=>{var P=k(()=>t.host.Now==1);return()=>P()?bt():ut()})()),lt.$$click=h,w(()=>B(D,"href","http://"+t.host.IP)),w(()=>m.value=t.host.Name),w(()=>A.checked=t.host.Known==1),o})()}G(["input","click"]);var gt=c('<div class="card border-primary"><div class=card-header>Port Scan</div><div class=card-body><form class=input-group><input type=text class=form-control placeholder=1><input type=text class=form-control placeholder=65535><button type=button class="btn btn-primary">Scan</button></form><div class=mt-2>'),_t=c('<div class="d-flex justify-content-between mt-2"><button type=button class="btn btn-warning">Stop/Continue</button><div>Scanning port: '),mt=c("<a class=me-4 target=_blank>");function vt(t){let i=!1;const[r,l]=x(""),[h,o]=x(""),[f,p]=x(""),[g,H]=x([]),_=async()=>{i=!1;let a=Number(r());(Number.isNaN(a)||a<1||a>65535)&&(a=1);let s=Number(h());(Number.isNaN(s)||s<1||s>65535)&&(s=65535);let b;for(let d=a;d<=s&&!i;d++)p(d.toString()),b=await nt(t.IP,d),b&&H([...g(),d])},I=()=>{i?(l(f()),_()):i=!0};return(()=>{var a=gt(),s=a.firstChild,b=s.nextSibling,d=b.firstChild,m=d.firstChild,v=m.nextSibling,N=v.nextSibling,C=d.nextSibling;return m.$$input=n=>l(n.target.value),v.$$input=n=>o(n.target.value),N.$$click=_,e(b,(()=>{var n=k(()=>f()!="");return()=>n()?(()=>{var $=_t(),y=$.firstChild,S=y.nextSibling;return S.firstChild,y.$$click=I,e(S,f,null),$})():[]})(),C),e(C,u(rt,{get each(){return g()},children:n=>(()=>{var $=mt();return e($,n),w(()=>B($,"href","http://"+t.IP+":"+n)),$})()})),a})()}G(["input","click"]);var St=c('<div class="card border-primary"><div class="card-header d-flex justify-content-between"><div>Host History</div></div><div class=card-body>');function xt(t){const i=localStorage.getItem("hostShow");return O(+i),(q()===0||isNaN(q()))&&O(500),(()=>{var r=St(),l=r.firstChild;l.firstChild;var h=l.nextSibling;return e(l,u(ot,{name:"hostShow"}),null),e(h,(()=>{var o=k(()=>t.mac!=="");return()=>o()?u($t,{get mac(){return t.mac}}):"Loading..."})()),r})()}var Ct=c("<div class=row><div class=col-md></div><div class=col-md>"),yt=c('<div class="row mt-4"><div class=col-md>');function Ht(){const[t,i]=x(at);return st(async()=>{const r=dt(),l=await ct(r.id);i(l)}),[(()=>{var r=Ct(),l=r.firstChild,h=l.nextSibling;return e(l,u(ft,{get host(){return t()}})),e(h,u(vt,{get IP(){return t().IP}})),r})(),(()=>{var r=yt(),l=r.firstChild;return e(l,u(xt,{get mac(){return t().Mac}})),r})()]}export{Ht as default};
+import{t as c,i as e,j as k,b as w,s as G,p as K,q as O,r as rt,h as L,c as x,e as u,F as nt,u as at,k as q,l as B,v as st,o as dt,w as ct,x as ot}from"./index.js";import{H as $t,M as ht}from"./HistShow.js";var bt=c('<div class="card border-primary"><div class=card-header>Host</div><div class="card-body table-responsive"><table class="table table-striped table-hover"><tbody><tr><td>ID</td><td></td></tr><tr><td>Name</td><td><input type=text class=form-control></td></tr><tr><td>DNS name</td><td></td></tr><tr><td>Iface</td><td></td></tr><tr><td>IP</td><td><a target=_blank></a></td></tr><tr><td>MAC</td><td></td></tr><tr><td>Hardware</td><td></td></tr><tr><td>Date</td><td></td></tr><tr><td>Known</td><td><div class="form-check form-switch"><input class=form-check-input type=checkbox></div></td></tr><tr><td>Online</td><td></td></tr></tbody></table><button type=button class="btn btn-outline-danger">Delete host'),ut=c('<i class="bi bi-check-circle-fill"style=color:var(--bs-success);>'),ft=c('<i class="bi bi-circle-fill"style=color:var(--bs-gray-500);>');function gt(t){let i="";const r=async o=>{i=o,await K(t.host.ID,i,""),O()},l=async()=>{i==""&&(i=t.host.Name),await K(t.host.ID,i,"toggle"),O()},h=async()=>{await rt(t.host.ID),window.location.href="/"};return(()=>{var o=bt(),f=o.firstChild,p=f.nextSibling,g=p.firstChild,H=g.firstChild,_=H.firstChild,I=_.firstChild,a=I.nextSibling,s=_.nextSibling,b=s.firstChild,d=b.nextSibling,m=d.firstChild,v=s.nextSibling,N=v.firstChild,C=N.nextSibling,n=v.nextSibling,$=n.firstChild,y=$.nextSibling,S=n.nextSibling,R=S.firstChild,T=R.nextSibling,D=T.firstChild,M=S.nextSibling,z=M.firstChild,J=z.nextSibling,E=M.nextSibling,Q=E.firstChild,U=Q.nextSibling,j=E.nextSibling,V=j.firstChild,W=V.nextSibling,F=j.nextSibling,X=F.firstChild,Y=X.nextSibling,Z=Y.firstChild,A=Z.firstChild,tt=F.nextSibling,et=tt.firstChild,lt=et.nextSibling,it=g.nextSibling;return e(a,()=>t.host.ID),m.$$input=P=>r(P.target.value),e(C,()=>t.host.DNS),e(y,()=>t.host.Iface),e(D,()=>t.host.IP),e(J,()=>t.host.Mac),e(U,()=>t.host.Hw),e(W,()=>t.host.Date),A.$$click=l,e(lt,(()=>{var P=k(()=>t.host.Now==1);return()=>P()?ut():ft()})()),it.$$click=h,w(()=>G(D,"href","http://"+t.host.IP)),w(()=>m.value=t.host.Name),w(()=>A.checked=t.host.Known==1),o})()}L(["input","click"]);var _t=c('<div class="card border-primary"><div class=card-header>Port Scan</div><div class=card-body><form class=input-group><input type=text class=form-control placeholder=1><input type=text class=form-control placeholder=65535><button type=button class="btn btn-primary">Scan</button></form><div class=mt-2>'),mt=c('<div class="d-flex justify-content-between mt-2"><button type=button class="btn btn-warning">Stop/Continue</button><div>Scanning port: '),vt=c("<a class=me-4 target=_blank>");function St(t){let i=!1;const[r,l]=x(""),[h,o]=x(""),[f,p]=x(""),[g,H]=x([]),_=async()=>{i=!1;let a=Number(r());(Number.isNaN(a)||a<1||a>65535)&&(a=1);let s=Number(h());(Number.isNaN(s)||s<1||s>65535)&&(s=65535);let b;for(let d=a;d<=s&&!i;d++)p(d.toString()),b=await at(t.IP,d),b&&H([...g(),d])},I=()=>{i?(l(f()),_()):i=!0};return(()=>{var a=_t(),s=a.firstChild,b=s.nextSibling,d=b.firstChild,m=d.firstChild,v=m.nextSibling,N=v.nextSibling,C=d.nextSibling;return m.$$input=n=>l(n.target.value),v.$$input=n=>o(n.target.value),N.$$click=_,e(b,(()=>{var n=k(()=>f()!="");return()=>n()?(()=>{var $=mt(),y=$.firstChild,S=y.nextSibling;return S.firstChild,y.$$click=I,e(S,f,null),$})():[]})(),C),e(C,u(nt,{get each(){return g()},children:n=>(()=>{var $=vt();return e($,n),w(()=>G($,"href","http://"+t.IP+":"+n)),$})()})),a})()}L(["input","click"]);var xt=c('<div class="card border-primary"><div class="card-header d-flex justify-content-between"><div>Host History</div></div><div class=card-body>');function Ct(t){const i=localStorage.getItem("hostShow");return q(+i),(B()===0||isNaN(B()))&&q(500),(()=>{var r=xt(),l=r.firstChild;l.firstChild;var h=l.nextSibling;return e(l,u($t,{name:"hostShow"}),null),e(h,(()=>{var o=k(()=>t.mac!=="");return()=>o()?u(ht,{get mac(){return t.mac}}):"Loading..."})()),r})()}var yt=c("<div class=row><div class=col-md></div><div class=col-md>"),wt=c('<div class="row mt-4"><div class=col-md>');function It(){const[t,i]=x(st);return dt(async()=>{const r=ct(),l=await ot(r.id);i(l)}),[(()=>{var r=yt(),l=r.firstChild,h=l.nextSibling;return e(l,u(gt,{get host(){return t()}})),e(h,u(St,{get IP(){return t().IP}})),r})(),(()=>{var r=wt(),l=r.firstChild;return e(l,u(Ct,{get mac(){return t().Mac}})),r})()]}export{It as default};

internal/web/public/version

@@ -1 +1 @@
-VERSION=2.1.0
+VERSION=2.1.1