Refactor ListWidgetSP functions from macros to inline methods

Consolidate multiple macro-defined functions into inline methods within ListWidgetSP to improve readability and maintainability. This change ensures that the widget functionalities are more straightforward and easier to debug. Adjust related headers and implementation files accordingly.

selfdrive/ui/qt/home.h

@@ -12,16 +12,17 @@
 #include "selfdrive/ui/qt/body.h"
 #include "selfdrive/ui/qt/onroad/onroad_home.h"
 #include "selfdrive/ui/qt/sidebar.h"
-#include "selfdrive/ui/qt/widgets/controls.h"
 #include "selfdrive/ui/qt/widgets/offroad_alerts.h"
 #include "selfdrive/ui/ui.h"
 
 #ifdef SUNNYPILOT
+#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
 #include "selfdrive/ui/sunnypilot/qt/sp_priv_offroad_home.h"
 #include "selfdrive/ui/sunnypilot/qt/onroad/sp_priv_onroad_home.h"
 #define OnroadWindow OnroadWindowSP
 #define OffroadHome OffroadHomeSP
 #else
+#include "selfdrive/ui/qt/widgets/controls.h"
 #include "selfdrive/ui/qt/onroad/onroad_home.h"
 #include "selfdrive/ui/qt/offroad_home.h"
 #endif

selfdrive/ui/qt/maps/map_settings.h

@@ -13,7 +13,11 @@
 
 #include "common/params.h"
 #include "selfdrive/ui/qt/util.h"
+#ifdef SUNNYPILOT
+#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
+#else
 #include "selfdrive/ui/qt/widgets/controls.h"
+#endif
 
 const QString NAV_TYPE_FAVORITE = "favorite";
 const QString NAV_TYPE_RECENT = "recent";

selfdrive/ui/qt/network/networking.cc

@@ -9,7 +9,6 @@
 #include "selfdrive/ui/ui.h"
 #include "selfdrive/ui/qt/qt_window.h"
 #include "selfdrive/ui/qt/util.h"
-#include "selfdrive/ui/qt/widgets/controls.h"
 #include "selfdrive/ui/qt/widgets/scrollview.h"
 
 static const int ICON_WIDTH = 49;

selfdrive/ui/qt/network/networking.h

@@ -6,6 +6,12 @@
 #include "selfdrive/ui/qt/widgets/input.h"
 #include "selfdrive/ui/qt/widgets/ssh_keys.h"
 #include "selfdrive/ui/qt/widgets/toggle.h"
+#ifdef SUNNYPILOT
+#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
+#define ListWidget ListWidgetSP
+#else
+#include "selfdrive/ui/qt/widgets/controls.h"
+#endif
 
 class WifiItem : public QWidget {
   Q_OBJECT

selfdrive/ui/qt/offroad/settings.h

@@ -13,14 +13,14 @@
 
 #include "selfdrive/ui/ui.h"
 #include "selfdrive/ui/qt/util.h"
-#ifdef SUNNYPILOT
-#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
-#else
-#include "selfdrive/ui/qt/widgets/controls.h"
-#endif
 
 #ifdef SUNNYPILOT
 #include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
+#define ListWidget ListWidgetSP
+#define ParamControl ParamControlSP
+#define ButtonParamControl ButtonParamControlSP
+#else
+#include "selfdrive/ui/qt/widgets/controls.h"
 #endif
 
 // ********** settings window + top-level panels **********
@@ -99,10 +99,6 @@ protected:
   virtual void updateToggles();
 };
 
-#ifdef SUNNYPILOT
-#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
-#define ListWidget ListWidgetSP
-#endif
 
 class SoftwarePanel : public ListWidget {
   Q_OBJECT
@@ -125,4 +121,3 @@ protected:
   Params params;
   ParamWatcher *fs_watch;
 };
-#undef ListWidget //To prevent this from unintentionally extending to other headers that included this one 

selfdrive/ui/qt/offroad/software_settings.cc

@@ -11,7 +11,11 @@
 #include "common/util.h"
 #include "selfdrive/ui/ui.h"
 #include "selfdrive/ui/qt/util.h"
+#ifdef SUNNYPILOT
+#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
+#else
 #include "selfdrive/ui/qt/widgets/controls.h"
+#endif
 #include "selfdrive/ui/qt/widgets/input.h"
 #include "system/hardware/hw.h"
 

selfdrive/ui/qt/offroad_home.h

@@ -13,15 +13,16 @@
 #include "selfdrive/ui/qt/body.h"
 #include "selfdrive/ui/qt/onroad/onroad_home.h"
 #include "selfdrive/ui/qt/sidebar.h"
-#include "selfdrive/ui/qt/widgets/controls.h"
 #include "selfdrive/ui/qt/widgets/offroad_alerts.h"
 #include "selfdrive/ui/ui.h"
 
 #ifdef SUNNYPILOT
+#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
 #include "selfdrive/ui/sunnypilot/qt/onroad/sp_priv_onroad_home.h"
 #define OnroadWindow OnroadWindowSP
 #define OffroadHomeImp OffroadHomeSP
 #else
+#include "selfdrive/ui/qt/widgets/controls.h"
 #include "selfdrive/ui/qt/onroad/onroad_home.h"
 #endif
 

selfdrive/ui/qt/widgets/controls.cc

@@ -3,12 +3,6 @@
 #include <QPainter>
 #include <QStyleOption>
 
-#ifdef SUNNYPILOT
-#define TITLE_FONT_WEIGHT 450
-#else
-#define TITLE_FONT_WEIGHT 400
-#endif
-
 AbstractControl::AbstractControl(const QString &title, const QString &desc, const QString &icon, QWidget *parent) : QFrame(parent) {
   QVBoxLayout *main_layout = new QVBoxLayout(this);
   main_layout->setMargin(0);
@@ -30,9 +24,7 @@ AbstractControl::AbstractControl(const QString &title, const QString &desc, cons
   // title
   title_label = new QPushButton(title);
   title_label->setFixedHeight(120);
-  QString styleSheet = QString("font-size: 50px; font-weight: %1; text-align: left; border: none;")
-                       .arg(TITLE_FONT_WEIGHT);
-  title_label->setStyleSheet(styleSheet);
+  title_label->setStyleSheet("font-size: 50px; font-weight: 400; text-align: left; border: none;");
   hlayout->addWidget(title_label, 1);
 
   // value next to control button
@@ -146,4 +138,4 @@ void ParamControl::toggleClicked(bool state) {
   } else {
     toggle.togglePosition();
   }
-}
+}

selfdrive/ui/qt/widgets/controls.h

@@ -12,13 +12,7 @@
 
 #include "common/params.h"
 #include "selfdrive/ui/qt/widgets/input.h"
-#ifdef SUNNYPILOT
-#include "selfdrive/ui/sunnypilot/qt/sp_priv_util.h"
-#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_toggle.h"
-#define Toggle ToggleSP
-#else
 #include "selfdrive/ui/qt/widgets/toggle.h"
-#endif
 
 class ElidedLabel : public QLabel {
   Q_OBJECT
@@ -27,10 +21,6 @@ public:
   explicit ElidedLabel(QWidget *parent = 0);
   explicit ElidedLabel(const QString &text, QWidget *parent = 0);
 
-#ifdef SUNNYPILOT
-  ELIDED_LABEL_SET_STUFF
-#endif
-
 signals:
   void clicked();
 
@@ -58,13 +48,9 @@ public:
     title_label->setText(title);
   }
 
-#ifdef SUNNYPILOT
-  ABSTRACT_CONTROL_FUNCTION_1
-#else
   void setValue(const QString &val) {
     value->setText(val);
   }
-#endif
 
   const QString getDescription() {
     return description->text();
@@ -78,10 +64,6 @@ public slots:
     description->setVisible(true);
   }
 
-#ifdef SUNNYPILOT
-  ABSTRACT_CONTROL_FUNCTION_2
-#endif
-
 signals:
   void showDescriptionEvent();
 
@@ -121,9 +103,6 @@ public:
   ButtonControl(const QString &title, const QString &text, const QString &desc = "", QWidget *parent = nullptr);
   inline void setText(const QString &text) { btn.setText(text); }
   inline QString text() const { return btn.text(); }
-#ifdef SUNNYPILOT
-  BUTTON_CONTROL_FUNCTION_1
-#endif
 
 signals:
   void clicked();
@@ -197,14 +176,8 @@ private:
     }
   }
 
-#ifdef SUNNYPILOT
-protected:
-#endif
   std::string key;
   Params params;
-#ifdef SUNNYPILOT
-private:
-#endif
   QPixmap active_icon_pixmap;
   bool confirm = false;
   bool store_confirm = false;
@@ -291,11 +264,9 @@ class ListWidget : public QWidget {
     inner_layout.setSpacing(25); // default spacing is 25
     outer_layout.addStretch();
   }
-  
-
-  void addItem(QWidget *w) { inner_layout.addWidget(w); }
-  void addItem(QLayout *layout) { inner_layout.addLayout(layout); }
-  void setSpacing(int spacing) { inner_layout.setSpacing(spacing); }
+  inline void addItem(QWidget *w) { inner_layout.addWidget(w); }
+  inline void addItem(QLayout *layout) { inner_layout.addLayout(layout); }
+  inline void setSpacing(int spacing) { inner_layout.setSpacing(spacing); }
 
 private:
   void paintEvent(QPaintEvent *) override {
@@ -311,8 +282,6 @@ private:
     }
   }
   QVBoxLayout outer_layout;
-
-protected:
   QVBoxLayout inner_layout;
 };
 
@@ -324,4 +293,4 @@ public:
   LayoutWidget(QLayout *l, QWidget *parent = nullptr) : QWidget(parent) {
     setLayout(l);
   }
-};
+};

selfdrive/ui/qt/widgets/ssh_keys.h

@@ -3,7 +3,11 @@
 #include <QPushButton>
 
 #include "system/hardware/hw.h"
+#ifdef SUNNYPILOT
+#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
+#else
 #include "selfdrive/ui/qt/widgets/controls.h"
+#endif
 
 // SSH enable toggle
 class SshToggle : public ToggleControl {

selfdrive/ui/sunnypilot/qt/offroad/mads_settings.cc

@@ -50,7 +50,7 @@ MadsSettings::MadsSettings(QWidget* parent) : QWidget(parent) {
     toggles[param.toStdString()] = toggle;
 
     // trigger offroadTransition when going onroad/offroad
-    connect(uiState(), &UIState::offroadTransition, toggle, &ParamControl::setEnabled);
+    connect(uiState(), &UIState::offroadTransition, toggle, &ParamControlSP::setEnabled);
   }
 
   // trigger offroadTransition when going onroad/offroad

selfdrive/ui/sunnypilot/qt/offroad/models_fetcher.h

@@ -12,7 +12,11 @@
 #include "selfdrive/ui/ui.h"
 #include "selfdrive/ui/qt/util.h"
 #include "selfdrive/ui/sunnypilot/qt/offroad/json_fetcher.h"
+#ifdef SUNNYPILOT
+#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
+#else
 #include "selfdrive/ui/qt/widgets/controls.h"
+#endif
 #include "system/hardware/hw.h"
 
 static const QString MODELS_PATH = Hardware::PC() ? QDir::homePath() + "/.comma/media/0/models/" : "/data/media/0/models/";

selfdrive/ui/sunnypilot/qt/offroad/trips_settings.h

@@ -1,6 +1,10 @@
 #pragma once
 
+#ifdef SUNNYPILOT
+#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
+#else
 #include "selfdrive/ui/qt/widgets/controls.h"
+#endif
 #include "selfdrive/ui/sunnypilot/qt/widgets/drive_stats.h"
 
 class TripsPanel : public QFrame {

selfdrive/ui/sunnypilot/qt/onroad/onroad_settings.h

@@ -8,7 +8,11 @@
 #include "common/params.h"
 #include "selfdrive/ui/ui.h"
 #include "selfdrive/ui/qt/util.h"
+#ifdef SUNNYPILOT
+#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
+#else
 #include "selfdrive/ui/qt/widgets/controls.h"
+#endif
 
 class OptionWidget;
 

selfdrive/ui/sunnypilot/qt/sp_priv_home.h

@@ -11,7 +11,6 @@
 #include "selfdrive/ui/qt/offroad/driverview.h"
 #include "selfdrive/ui/qt/body.h"
 #include "selfdrive/ui/qt/sidebar.h"
-#include "selfdrive/ui/qt/widgets/controls.h"
 #include "selfdrive/ui/qt/widgets/offroad_alerts.h"
 #include "selfdrive/ui/ui.h"
 #include "selfdrive/ui/qt/home.h"

selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.cc

@@ -1,5 +1,8 @@
 #include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
 
+#include <QPainter>
+#include <QStyleOption>
+
 QFrame *horizontal_line(QWidget *parent) {
   QFrame *line = new QFrame(parent);
   line->setFrameShape(QFrame::StyledPanel);
@@ -12,6 +15,65 @@ QFrame *horizontal_line(QWidget *parent) {
   return line;
 }
 
+AbstractControl::AbstractControl(const QString &title, const QString &desc, const QString &icon, QWidget *parent) : QFrame(parent) {
+  QVBoxLayout *main_layout = new QVBoxLayout(this);
+  main_layout->setMargin(0);
+
+  hlayout = new QHBoxLayout;
+  hlayout->setMargin(0);
+  hlayout->setSpacing(20);
+
+  // left icon
+  icon_label = new QLabel(this);
+  hlayout->addWidget(icon_label);
+  if (!icon.isEmpty()) {
+    icon_pixmap = QPixmap(icon).scaledToWidth(80, Qt::SmoothTransformation);
+    icon_label->setPixmap(icon_pixmap);
+    icon_label->setSizePolicy(QSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed));
+  }
+  icon_label->setVisible(!icon.isEmpty());
+
+  // title
+  title_label = new QPushButton(title);
+  title_label->setFixedHeight(120);
+  title_label->setStyleSheet("font-size: 50px; font-weight: 450; text-align: left; border: none;");
+  hlayout->addWidget(title_label, 1);
+
+  // value next to control button
+  value = new ElidedLabel();
+  value->setAlignment(Qt::AlignRight | Qt::AlignVCenter);
+  value->setStyleSheet("color: #aaaaaa");
+  hlayout->addWidget(value);
+
+  main_layout->addLayout(hlayout);
+
+  // description
+  description = new QLabel(desc);
+  description->setContentsMargins(40, 20, 40, 20);
+  description->setStyleSheet("font-size: 40px; color: grey");
+  description->setWordWrap(true);
+  description->setVisible(false);
+  main_layout->addWidget(description);
+
+  connect(title_label, &QPushButton::clicked, [=]() {
+    if (!description->isVisible()) {
+      emit showDescriptionEvent();
+    }
+
+    if (!description->text().isEmpty()) {
+      description->setVisible(!description->isVisible());
+    }
+  });
+
+  main_layout->addStretch();
+}
+
+void AbstractControl::hideEvent(QHideEvent *e) {
+  if (description != nullptr) {
+    description->hide();
+  }
+}
+
 AbstractControlSP::AbstractControlSP(const QString &title, const QString &desc, const QString &icon, QWidget *parent) : QFrame(parent) {
   QVBoxLayout *main_layout = new QVBoxLayout(this);
   main_layout->setMargin(0);
@@ -55,13 +117,67 @@ AbstractControlSP::AbstractControlSP(const QString &title, const QString &desc,
 }
 
 void AbstractControlSP::hideEvent(QHideEvent *e) {
-  if (description != nullptr) {
-    description->hide();
-  }
 }
 
+// controls
+
+ButtonControlSP::ButtonControlSP(const QString &title, const QString &text, const QString &desc, QWidget *parent) : AbstractControl(title, desc, "", parent) {
+  btn.setText(text);
+  btn.setStyleSheet(R"(
+    QPushButton {
+      padding: 0;
+      border-radius: 50px;
+      font-size: 35px;
+      font-weight: 500;
+      color: #E4E4E4;
+      background-color: #393939;
+    }
+    QPushButton:pressed {
+      background-color: #4a4a4a;
+    }
+    QPushButton:disabled {
+      color: #33E4E4E4;
+    }
+  )");
+  btn.setFixedSize(250, 100);
+  QObject::connect(&btn, &QPushButton::clicked, this, &ButtonControlSP::clicked);
+  hlayout->addWidget(&btn);
+}
+
+// ElidedLabelSP
+
+ElidedLabelSP::ElidedLabelSP(QWidget *parent) : ElidedLabelSP({}, parent) {}
+
+ElidedLabelSP::ElidedLabelSP(const QString &text, QWidget *parent) : QLabel(text.trimmed(), parent) {
+  setSizePolicy(QSizePolicy::Preferred, QSizePolicy::Preferred);
+  setMinimumWidth(1);
+}
+
+void ElidedLabelSP::resizeEvent(QResizeEvent* event) {
+  QLabel::resizeEvent(event);
+  lastText_ = elidedText_ = "";
+}
+
+void ElidedLabelSP::paintEvent(QPaintEvent *event) {
+  const QString curText = text();
+  if (curText != lastText_) {
+    elidedText_ = fontMetrics().elidedText(curText, Qt::ElideRight, contentsRect().width());
+    lastText_ = curText;
+  }
+
+  QPainter painter(this);
+  drawFrame(&painter);
+  QStyleOption opt;
+  opt.initFrom(this);
+  style()->drawItemText(&painter, contentsRect(), alignment(), opt.palette, isEnabled(), elidedText_, foregroundRole());
+}
+
+// ParamControlSP
+
 ParamControlSP::ParamControlSP(const QString &param, const QString &title, const QString &desc, const QString &icon, QWidget *parent)
-    : ParamControl(param, title, desc, icon, parent) {
+    : ToggleControlSP(title, desc, icon, false, parent) {
+  key = param.toStdString();
+  QObject::connect(this, &ParamControlSP::toggleFlipped, this, &ParamControlSP::toggleClicked);
 
   hlayout->removeWidget(&toggle);
   hlayout->insertWidget(0, &toggle);
@@ -72,3 +188,20 @@ ParamControlSP::ParamControlSP(const QString &param, const QString &title, const
   this->icon_label->setSizePolicy(QSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed));
   hlayout->insertWidget(1, this->icon_label);
 }
+
+void ParamControlSP::toggleClicked(bool state) {
+  auto do_confirm = [this]() {
+    QString content("<body><h2 style=\"text-align: center;\">" + title_label->text() + "</h2><br>"
+                    "<p style=\"text-align: center; margin: 0 128px; font-size: 50px;\">" + getDescription() + "</p></body>");
+    return ConfirmationDialog(content, tr("Enable"), tr("Cancel"), true, this).exec();
+  };
+
+  bool confirmed = store_confirm && params.getBool(key + "Confirmed");
+  if (!confirm || confirmed || !state || do_confirm()) {
+    if (store_confirm && state) params.putBool(key + "Confirmed", true);
+    params.putBool(key, state);
+    setIcon(state);
+  } else {
+    toggle.togglePosition();
+  }
+}

selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h

@@ -1,18 +1,108 @@
 #pragma once
 
-#include "selfdrive/ui/qt/widgets/controls.h"
+#include <optional>
+#include <string>
+#include <vector>
+
+#include <QButtonGroup>
+#include <QFrame>
+#include <QHBoxLayout>
+#include <QLabel>
+#include <QPainter>
+#include <QPushButton>
+
+#include "common/params.h"
+#include "selfdrive/ui/qt/widgets/input.h"
+//#include "selfdrive/ui/qt/widgets/toggle.h"
+#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_toggle.h"
+
+// This is for compatibility purposes, until we properly do inheritance splitting
+// This is because some controls were needing LabelControlSP, but the original code was using LabelControl
+// which was modified in-place in the past but since we now have a new file, we will be moving it to LabelControlSP
+#define LabelControl LabelControlSP
+#define ElidedLabel ElidedLabelSP
+#define ButtonControl ButtonControlSP
+#define Toggle ToggleSP
+#define ToggleControl ToggleControlSP
 
 QFrame *horizontal_line(QWidget *parent = nullptr);
 
-class ParamControlSP : public ParamControl {
+class ElidedLabelSP : public QLabel {
   Q_OBJECT
 
 public:
-  ParamControlSP(const QString &param, const QString &title, const QString &desc, const QString &icon, QWidget *parent = nullptr);
+  explicit ElidedLabelSP(QWidget *parent = 0);
+  explicit ElidedLabelSP(const QString &text, QWidget *parent = 0);
 
-  bool isToggled() { return params.getBool(key); }
+  void setColor(const QString &color) {
+    setStyleSheet("QLabel { color : " + color + "; }");
+  }
+
+signals:
+  void clicked();
+
+protected:
+  void paintEvent(QPaintEvent *event) override;
+  void resizeEvent(QResizeEvent* event) override;
+  void mouseReleaseEvent(QMouseEvent *event) override {
+    if (rect().contains(event->pos())) {
+      emit clicked();
+    }
+  }
+  QString lastText_, elidedText_;
 };
 
+class AbstractControl : public QFrame {
+  Q_OBJECT
+
+public:
+  void setDescription(const QString &desc) {
+    if (description) description->setText(desc);
+  }
+
+  void setTitle(const QString &title) {
+    title_label->setText(title);
+  }
+
+  void setValue(const QString &val, std::optional<QString> color = std::nullopt) {
+    value->setText(val);
+    if (color.has_value()) {
+      value->setColor(color.value());
+    }
+  }
+
+  const QString getDescription() {
+    return description->text();
+  }
+
+  QLabel *icon_label;
+  QPixmap icon_pixmap;
+
+  public slots:
+    void showDescription() {
+    description->setVisible(true);
+  }
+
+  void hideDescription() {
+    description->setVisible(false);
+  }
+
+  signals:
+    void showDescriptionEvent();
+
+protected:
+  AbstractControl(const QString &title, const QString &desc = "", const QString &icon = "", QWidget *parent = nullptr);
+  void hideEvent(QHideEvent *e) override;
+
+  QHBoxLayout *hlayout;
+  QPushButton *title_label;
+
+private:
+  ElidedLabel *value;
+  QLabel *description = nullptr;
+};
+
+
 class AbstractControlSP : public QFrame {
   Q_OBJECT
 
@@ -52,6 +142,114 @@ private:
   QLabel *description = nullptr;
 };
 
+
+// widget to display a value
+class LabelControlSP : public AbstractControl {
+  Q_OBJECT
+
+public:
+  LabelControlSP(const QString &title, const QString &text = "", const QString &desc = "", QWidget *parent = nullptr) : AbstractControl(title, desc, "", parent) {
+    label.setText(text);
+    label.setAlignment(Qt::AlignRight | Qt::AlignVCenter);
+    hlayout->addWidget(&label);
+  }
+  void setText(const QString &text) { label.setText(text); }
+
+private:
+  ElidedLabelSP label;
+};
+
+// widget for a button with a label
+class ButtonControlSP : public AbstractControl {
+  Q_OBJECT
+
+public:
+  ButtonControlSP(const QString &title, const QString &text, const QString &desc = "", QWidget *parent = nullptr);
+  inline void setText(const QString &text) { btn.setText(text); }
+  inline QString text() const { return btn.text(); }
+  inline void click() { btn.click(); }
+
+signals:
+  void clicked();
+
+public slots:
+  void setEnabled(bool enabled) { btn.setEnabled(enabled); }
+
+private:
+  QPushButton btn;
+};
+
+class ToggleControlSP : public AbstractControl {
+  Q_OBJECT
+
+public:
+  ToggleControlSP(const QString &title, const QString &desc = "", const QString &icon = "", const bool state = false, QWidget *parent = nullptr) : AbstractControl(title, desc, icon, parent) {
+    toggle.setFixedSize(150, 100);
+    if (state) {
+      toggle.togglePosition();
+    }
+    hlayout->addWidget(&toggle);
+    QObject::connect(&toggle, &Toggle::stateChanged, this, &ToggleControlSP::toggleFlipped);
+  }
+
+  void setEnabled(bool enabled) {
+    toggle.setEnabled(enabled);
+    toggle.update();
+  }
+
+signals:
+  void toggleFlipped(bool state);
+
+protected:
+  Toggle toggle;
+};
+
+// widget to toggle params
+class ParamControlSP : public ToggleControlSP {
+  Q_OBJECT
+
+public:
+  ParamControlSP(const QString &param, const QString &title, const QString &desc, const QString &icon, QWidget *parent = nullptr);
+  void setConfirmation(bool _confirm, bool _store_confirm) {
+    confirm = _confirm;
+    store_confirm = _store_confirm;
+  }
+
+  void setActiveIcon(const QString &icon) {
+    active_icon_pixmap = QPixmap(icon).scaledToWidth(80, Qt::SmoothTransformation);
+  }
+
+  void refresh() {
+    bool state = params.getBool(key);
+    if (state != toggle.on) {
+      toggle.togglePosition();
+      setIcon(state);
+    }
+  }
+
+  void showEvent(QShowEvent *event) override {
+    refresh();
+  }
+
+  bool isToggled() { return params.getBool(key); }
+
+private:
+  void toggleClicked(bool state);
+  void setIcon(bool state) {
+    if (state && !active_icon_pixmap.isNull()) {
+      icon_label->setPixmap(active_icon_pixmap);
+    } else if (!icon_pixmap.isNull()) {
+      icon_label->setPixmap(icon_pixmap);
+    }
+  }
+
+  std::string key;
+  Params params;
+  QPixmap active_icon_pixmap;
+  bool confirm = false;
+  bool store_confirm = false;
+};
+
 class ButtonParamControlSP : public AbstractControlSP {
   Q_OBJECT
 public:
@@ -183,30 +381,38 @@ private:
   bool button_group_enabled = true;
 };
 
-class ListWidgetSP : public ListWidget {
+class ListWidgetSP : public QWidget {
   Q_OBJECT
+ public:
+  explicit ListWidgetSP(QWidget *parent = 0, const bool split_line = true) : QWidget(parent), _split_line(split_line), outer_layout(this) {
+    outer_layout.setMargin(0);
+    outer_layout.setSpacing(0);
+    outer_layout.addLayout(&inner_layout);
+    inner_layout.setMargin(0);
+    inner_layout.setSpacing(25); // default spacing is 25
+    outer_layout.addStretch();
+  }
+  inline void addItem(QWidget *w) { inner_layout.addWidget(w); }
+  inline void addItem(QLayout *layout) { inner_layout.addLayout(layout); }
+  inline void setSpacing(int spacing) { inner_layout.setSpacing(spacing); }
 
-public:
-  explicit ListWidgetSP(QWidget *parent = 0, const bool split_line = true) : ListWidget(parent), _split_line(split_line) {
+  inline void AddWidgetAt(const int index, QWidget *new_widget) { inner_layout.insertWidget(index, new_widget); }
+  inline void RemoveWidgetAt(const int index) {
+    if (QLayoutItem* item; (item = inner_layout.takeAt(index)) != nullptr) {
+      if(item->widget()) delete item->widget();
+      delete item;
+    }
   }
 
-  void AddWidgetAt(const int index, QWidget *new_widget) { inner_layout.insertWidget(index, new_widget); }
-  void RemoveWidgetAt(const int index) {                              
-    if (QLayoutItem* item; (item = inner_layout.takeAt(index)) != nullptr) { 
-      if(item->widget()) delete item->widget();                              
-      delete item;                                                           
-    }                                                                        
-  }
-  using ListWidget::addItem;
-  void ReplaceOrAddWidget(QWidget *old_widget, QWidget *new_widget) {
+  inline void ReplaceOrAddWidget(QWidget *old_widget, QWidget *new_widget) {
     if (const int index = inner_layout.indexOf(old_widget); index != -1) {
       RemoveWidgetAt(index);
       AddWidgetAt(index, new_widget);
     } else {
-      AddWidgetAt(0, new_widget);
+      addItem(new_widget);
     }
   }
-  
+
 private:
   void paintEvent(QPaintEvent *) override {
     QPainter p(this);
@@ -220,8 +426,20 @@ private:
       }
     }
   }
+  QVBoxLayout outer_layout;
+  QVBoxLayout inner_layout;
 
-  bool _split_line = false;
+  bool _split_line;
+};
+
+// convenience class for wrapping layouts
+class LayoutWidget : public QWidget {
+  Q_OBJECT
+
+public:
+  LayoutWidget(QLayout *l, QWidget *parent = nullptr) : QWidget(parent) {
+    setLayout(l);
+  }
 };
 
 class OptionControlSP : public AbstractControlSP {
@@ -362,7 +580,7 @@ class SubPanelButton : public QPushButton {
   Q_OBJECT
 
 public:
-  explicit SubPanelButton(const QString &text, const int minimum_button_width = 800, QWidget *parent = nullptr) : QPushButton(text, parent) {
+  SubPanelButton(const QString &text, const int minimum_button_width = 800, QWidget *parent = nullptr) : QPushButton(text, parent) {
     const QString buttonStyle = R"(
       QPushButton {
         border-radius: 20px;
@@ -393,7 +611,7 @@ class PanelBackButton : public QPushButton {
   Q_OBJECT
 
 public:
-  explicit PanelBackButton(const QString &label = "Back", QWidget *parent = nullptr) : QPushButton(label, parent) {
+  PanelBackButton(const QString &label = "Back", QWidget *parent = nullptr) : QPushButton(label, parent) {
     setObjectName("back_btn");
     setFixedSize(400, 100);
   }

tools/cabana/detailwidget.h

@@ -6,7 +6,11 @@
 #include <QTextEdit>
 #include <set>
 
+#ifdef SUNNYPILOT
+#include "selfdrive/ui/sunnypilot/qt/widgets/sp_priv_controls.h"
+#else
 #include "selfdrive/ui/qt/widgets/controls.h"
+#endif
 #include "tools/cabana/binaryview.h"
 #include "tools/cabana/chart/chartswidget.h"
 #include "tools/cabana/historylog.h"