@@ -55,6 +55,11 @@ <h3>Network Status</h3>
5555 } ;
5656 _statesWithoutDialogClose = new Set ( [ this . _states . INITIALIZING ] ) ;
5757
58+ constructor ( ) {
59+ super ( ) ;
60+ this . _interfaceElements = { } ;
61+ }
62+
5863 connectedCallback ( ) {
5964 this . attachShadow ( { mode : "open" } ) . appendChild (
6065 template . content . cloneNode ( true )
@@ -130,19 +135,32 @@ <h3>Network Status</h3>
130135 ) ;
131136 return ;
132137 }
133- this . _elements . interfacesContainer . innerHTML = "" ;
134138 networkStatus . forEach ( ( iface ) => {
135- const interfaceElement = document . createElement (
136- "network-status-interface"
137- ) ;
139+ let interfaceElement = this . _interfaceElements [ iface . name ] ;
140+ if ( ! interfaceElement ) {
141+ interfaceElement = document . createElement (
142+ "network-status-interface"
143+ ) ;
144+ this . _interfaceElements [ iface . name ] = interfaceElement ;
145+ this . _elements . interfacesContainer . appendChild ( interfaceElement ) ;
146+ }
138147 const displayName = iface . name . startsWith ( "eth" )
139148 ? `LAN${ parseInt ( iface . name . slice ( 3 ) ) + 1 } `
140149 : iface . name . startsWith ( "wlan" )
141150 ? "Wi-Fi"
142151 : iface . name ;
143- this . _elements . interfacesContainer . appendChild ( interfaceElement ) ;
144152 interfaceElement . setEthernetWifi ( displayName , iface ) ;
145153 } ) ;
154+ const availableInterfaceNames = networkStatus . map (
155+ ( iface ) => iface . name
156+ ) ;
157+ // Remove unavailable network interface elements.
158+ Object . keys ( this . _interfaceElements )
159+ . filter ( ( key ) => ! availableInterfaceNames . includes ( key ) )
160+ . forEach ( ( interfaceName ) => {
161+ this . _interfaceElements [ interfaceName ] . remove ( ) ;
162+ delete this . _interfaceElements [ interfaceName ] ;
163+ } ) ;
146164 }
147165 }
148166 ) ;
0 commit comments