glzr-io / zebar

Zebar is a tool for creating customizable and cross-platform taskbars, desktop widgets, and popups.
GNU General Public License v3.0
1.11k stars 51 forks source link

[Bug] Printing ip.adress leads to panick #147

Closed michidk closed 2 weeks ago

michidk commented 2 weeks ago

Describe the bug

Zebar glazewm bar is empty when trying to print the IP address using IP provider.

JSON.stringify(output.ip) prints the object, works flawlessly JSON.stringify(ip.address) wont work ip.address wont work typeof(ip.address) returns string

Workaround

I wanna cry but this is what I use:

{JSON.stringify(output.ip).split('"')[3]}

Reproduction

Use glazewm starter template. Add ip provider (ip: { type: 'ip' },), then try to print it somewhere (output.ip.address).

The bar won't show anything besides the background.

Stack trace or error logs (if applicable)

Console log:

2024-11-09T16:37:11.762591Z  INFO zebar::sys_tray: Received tray menu event: reload_configs
2024-11-09T16:37:11.762701Z  INFO zebar::sys_tray: Opening config folder from system tray.
2024-11-09T16:37:11.764044Z  INFO zebar::config: Found valid widget config at: C:\Users\michi\.glzr\zebar\custom\with-glazewm.zebar.json
2024-11-09T16:37:11.764125Z  INFO zebar: Widget configs changed.
2024-11-09T16:37:11.764313Z  INFO zebar::widget_factory: Creating window for widget #3 from C:\Users\michi\.glzr\zebar\custom\with-glazewm.zebar.json
2024-11-09T16:37:11.765245Z  INFO zebar::widget_factory: Positioning widget to PhysicalSize { width: 3440, height: 40 } PhysicalPosition { x: 0, y: 0 }
2024-11-09T16:37:11.891775Z  INFO zebar::widget_factory: Creating window for widget #4 from C:\Users\michi\.glzr\zebar\custom\with-glazewm.zebar.json
2024-11-09T16:37:11.893345Z  INFO zebar::widget_factory: Positioning widget to PhysicalSize { width: 1200, height: 40 } PhysicalPosition { x: 3440, y: -220 }

Version number

The one installed with glazewm v3.5.0

lars-berger commented 2 weeks ago

If using one of the default configs, make sure to access it as output.ip.address, e.g.

const providers = zebar.createProviderGroup({
  ip: { type: 'ip' },
  // ... other provider configs
});

function App() {
  const [output, setOutput] = useState(providers.outputMap);

  useEffect(() => providers.onOutput(() => setOutput(providers.outputMap)), []);

  return (
    <div class="app">
      <div class="chip">IP: {output.ip?.address}</div>
    </div>
  );
}