Adding a Wireguard VPN switch

[rulonder]

Context

I needed to use ProtonVPN but there is no official application for Arch , although there is package in AUR I opted to implement my own solution in Waybar, I am describing it here in case it might be helpful for someone.

Preparation

Need to install Wireguard and copy the VPN configuration files into /etc/wireguard . This is described here for ProtonVPN , should be similar for other VPN as long as they provide the configuration files Installing Wireguard and ProtonVPN

Once we have the files in the folder we need to add wireguard command wg-quick to the sudoers configuration so that we do not need to provide the password when switching the VPN on and off . Evaluate carefully that this is not a security issue in your case.

# edit sudoers
sudo visudo

# add this line with your user , assuming is part of group wheel 
%wheel ALL=(ALL) NOPASSWD: /usr/bin/wg-quick

Installation

We are gonna generate 3 scripts in the .config/waybar folder , although another folder could be used. And we are gonna update the Waybar config and style.css files. a vpn.conf file will be created to store the selected VPN to use, this can be changed by right-click on the icon this will open a new window and will ask for the password.

Scripts

check-vpn-status.sh
#!/bin/bash
source "$(dirname "$0")/vpn.conf"
if ip link show | grep -q "$VPN_NAME"; then
  echo "{\"text\": \"\" , \"class\": \"active\", \"tooltip\": \"VPN Connected: $VPN_NAME\"}"
else
  echo "{\"text\": \"\", \"class\": \"inactive\", \"tooltip\": \"VPN Disconnected\"}"
fi

toggle-vpn.sh
#!/bin/bash
source "$(dirname "$0")/vpn.conf"
if ip link show | grep -q "$VPN_NAME"; then
  #echo "$(date -u +'%Y-%m-%dT%H:%M:%SZ') - VPN DOWN" >>"$(dirname $0)/vpn.log"
  sudo wg-quick down "$VPN_NAME"
else
  #echo "$(date -u +'%Y-%m-%dT%H:%M:%SZ') - VPN UP" >>"$(dirname $0)/vpn.log"
  sudo wg-quick up "$VPN_NAME"
fi

select.sh
#!/bin/bash

# Find available VPN configurations
configs_path="/etc/wireguard"
configs=($(ls "$configs_path"/*.conf 2>/dev/null | xargs -n 1 basename -s .conf))

if [ ${#configs[@]} -eq 0 ]; then
  echo "No WireGuard configurations found in $configs_path"
  exit 1
fi

# Present a selection menu
echo "Select a VPN configuration:"
select vpn_name in "${configs[@]}"; do
  if [ -n "$vpn_name" ]; then
    # Get the current VPN name
    source "$(dirname "$0")/vpn.conf"

    # Update vpn.conf
    echo "VPN_NAME=\"$vpn_name\"" >"$(dirname "$0")/vpn.conf"
    echo "VPN configuration updated to $vpn_name"
    # If a VPN is connected, disconnect it
    if ip link show | grep -q "$VPN_NAME"; then
      echo "Disconnecting from $VPN_NAME..."
      sudo wg-quick down "$VPN_NAME"
      # Connect to the new VPN
      echo "Connecting to $vpn_name..."
      sudo wg-quick up "$vpn_name"
    fi

    break
  else
    echo "Invalid selection."
  fi
done

Update style.css by adding the following styles. Change or remove the activate color if you don't like the green color.

#custom-vpn {
  margin: 0 7.5px;
}

#custom-vpn.active {
  color: #a6e3a1; /* Green */
}

Update the waybar.conf file

# add  "custom/vpn", to the list of widgets
  "modules-right": [
    "group/tray-expander",
    "bluetooth",
    "network",
    "custom/vpn",
    "pulseaudio",
    "cpu",
    "battery"
  ],

# add the definition
 "custom/vpn": {
    "format": "{}",
     "interval": 5,
    "return-type": "json",
    "exec": "~/.config/waybar/check-vpn-status.sh",
    "on-click": "~/.config/waybar/toggle-vpn.sh",
    "on-click-right": "alacritty -e sudo ~/.config/waybar/select.sh"
}

[lajosdeme]

Thank you for putting this together. I was about to implement something similar on my own when I stumbled upon this, and it helped me and saved me some time. I created a ready to use setup script based on this guide so it might make it easier for others to get this set up. You may find it here.

[JacobusXIII]

Big thanks for the scripts above! 🙌

I also gave it a go and turned it into a one-line installer for quick setup. I used the Omarchy bash scripts as a coding guideline, trying to keep it consistent with the project’s style. You can find my implementation here: JacobusXIII/omarchy-wireguard-vpn-toggle