fix: various fixes (#353)

* fix: make admin buttons look right
* fix: more reliable subproc termination
* feat: empirica menu top bottom positions

.changeset/admin-buttons.md

@@ -0,0 +1,5 @@
+---
+"@empirica/core": patch
+---
+
+Make admin buttons look right again.

.changeset/menu-positions.md

@@ -0,0 +1,6 @@
+---
+"@empirica/core": patch
+---
+
+`EmpiricaMenu` component improvements. Add `top` and `bottom` positions. Improve
+styling and readability. Use Lucide icons.

.changeset/reliable-subprocs.md

@@ -0,0 +1,5 @@
+---
+"@empirica/core": patch
+---
+
+Make subprocs terminate more reliably.

cmds/empirica/cmd/export.go

@@ -7,6 +7,7 @@ import (
 	"os/exec"
 	"path"
 	"strings"
+	"syscall"
 	"time"
 
 	"github.com/empiricaly/empirica/internal/build"
@@ -145,6 +146,9 @@ func addExportCommand(parent *cobra.Command) error {
 				Msg("exporting data")
 
 			c := exec.CommandContext(ctx, "empirica", exportArgs...)
+			c.SysProcAttr = &syscall.SysProcAttr{
+				Pdeathsig: syscall.SIGKILL,
+			}
 
 			c.Stderr = os.Stderr
 			c.Stdout = os.Stdout

cmds/proxy/cmd/root.go

@@ -60,6 +60,9 @@ func root(args []string) error {
 		Msg("proxy: chosen binary path")
 
 	c := exec.CommandContext(ctx, path, args...)
+	c.SysProcAttr = &syscall.SysProcAttr{
+		Pdeathsig: syscall.SIGKILL,
+	}
 
 	c.Stderr = os.Stderr
 	c.Stdout = os.Stdout

internal/bundle/serve.go

@@ -8,6 +8,7 @@ import (
 	"path"
 	"path/filepath"
 	"strings"
+	"syscall"
 
 	"github.com/empiricaly/empirica"
 	"github.com/empiricaly/empirica/internal/server"
@@ -76,6 +77,9 @@ func Serve(ctx context.Context, config *empirica.Config, in string, clean, devMo
 			Msg("serve: start server command")
 
 		c := exec.CommandContext(ctx, cmd, args...)
+		c.SysProcAttr = &syscall.SysProcAttr{
+			Pdeathsig: syscall.SIGKILL,
+		}
 
 		p := path.Join(dir, "callbacks")
 

internal/callbacks/callbacks.go

@@ -50,6 +50,10 @@ func Build(ctx context.Context, config *Config) error {
 	}
 
 	c := exec.CommandContext(ctx, parts[0], args...)
+	c.SysProcAttr = &syscall.SysProcAttr{
+		Setpgid:   true,
+		Pdeathsig: syscall.SIGKILL,
+	}
 
 	c.Stderr = os.Stderr
 	c.Stdout = os.Stdout
@@ -116,6 +120,14 @@ const (
 )
 
 func (cb *Callbacks) sigint() {
+	if cb.c == nil {
+		log.Debug().Msg("callback: no process to send signal to")
+
+		return
+	}
+
+	log.Debug().Msg("callback: cancelling process")
+
 	pgid, err := syscall.Getpgid(cb.c.Process.Pid)
 	if err != nil {
 		log.Debug().Err(err).Msg("callback: failed to send signal")
@@ -127,9 +139,9 @@ func (cb *Callbacks) sigint() {
 		log.Debug().Err(err).Msg("callback: failed to send signal")
 	}
 
-	// if err := cb.c.Process.Signal(os.Interrupt); err != nil {
-	// 	log.Debug().Err(err).Msg("callback: failed to send signal")
-	// }
+	if err := cb.c.Process.Signal(os.Interrupt); err != nil {
+		log.Debug().Err(err).Msg("callback: failed to send signal")
+	}
 
 	cb.c = nil
 }
@@ -271,7 +283,9 @@ func (cb *Callbacks) run(ctx context.Context) {
 
 		select {
 		case <-ctx.Done():
+			cb.Lock()
 			cb.sigint()
+			cb.Unlock()
 
 			return
 		case err = <-waiting:
@@ -282,7 +296,9 @@ func (cb *Callbacks) run(ctx context.Context) {
 
 			var exitError *exec.ExitError
 			if errors.As(err, &exitError) {
+				cb.Lock()
 				cb.c = nil
+				cb.Unlock()
 
 				if hardExits, shouldExit = checkHardExit(lastHardExit, hardExits, err); shouldExit {
 					return
@@ -354,7 +370,10 @@ func (cb *Callbacks) runOnce(ctx context.Context) (*exec.Cmd, error) {
 	}
 
 	c := exec.CommandContext(ctx, parts[0], remainder...) // #nosec G204
-	c.SysProcAttr = &syscall.SysProcAttr{Setpgid: true, Pgid: 0}
+	c.SysProcAttr = &syscall.SysProcAttr{
+		Setpgid:   true,
+		Pdeathsig: syscall.SIGKILL,
+	}
 
 	c.Stderr = cb.stderr
 	c.Stdout = cb.stdout

internal/experiment/utils.go

@@ -7,6 +7,7 @@ import (
 	"os"
 	"os/exec"
 	"strings"
+	"syscall"
 	"time"
 
 	"github.com/briandowns/spinner"
@@ -35,6 +36,9 @@ func RunCmdSilent(ctx context.Context, dir, command string, args ...string) erro
 
 func runCmdSilence(ctx context.Context, dir string, silent bool, command string, args ...string) error {
 	c := exec.CommandContext(ctx, command, args...)
+	c.SysProcAttr = &syscall.SysProcAttr{
+		Pdeathsig: syscall.SIGKILL,
+	}
 
 	if !silent {
 		c.Stderr = os.Stderr

internal/player/player.go

@@ -8,6 +8,7 @@ import (
 	"os/exec"
 	"path"
 	"strings"
+	"syscall"
 	"time"
 
 	"github.com/empiricaly/empirica/internal/term"
@@ -37,6 +38,9 @@ func Build(ctx context.Context, config *Config) error {
 	}
 
 	c := exec.CommandContext(ctx, parts[0], args...)
+	c.SysProcAttr = &syscall.SysProcAttr{
+		Pdeathsig: syscall.SIGKILL,
+	}
 
 	c.Stderr = os.Stderr
 	c.Stdout = os.Stdout
@@ -164,6 +168,9 @@ func (p *Player) runDevCmd(ctx context.Context) (*exec.Cmd, error) {
 	log.Trace().Str("cmd", strings.Join(parts, " ")).Msg("player: run player dev command")
 
 	c := exec.CommandContext(ctx, parts[0], args...)
+	c.SysProcAttr = &syscall.SysProcAttr{
+		Pdeathsig: syscall.SIGKILL,
+	}
 
 	c.Stderr = os.Stderr
 	c.Stdout = p.stdout

internal/settings/shared.go

@@ -6,6 +6,7 @@ import (
 	"os/exec"
 	"path"
 	"strings"
+	"syscall"
 
 	"github.com/adrg/xdg"
 	"github.com/pkg/errors"
@@ -84,6 +85,9 @@ func InstallVolta(ctx context.Context) error {
 
 func runCmd(ctx context.Context, dir, command string, args ...string) error {
 	c := exec.CommandContext(ctx, command, args...)
+	c.SysProcAttr = &syscall.SysProcAttr{
+		Pdeathsig: syscall.SIGKILL,
+	}
 
 	c.Stderr = os.Stderr
 	c.Stdout = os.Stdout

lib/@empirica/core/src/player/react/EmpiricaMenu.tsx

@@ -4,7 +4,13 @@ import { Logo } from "./Logo";
 import { useParticipantContext } from "./hooks";
 
 export type EmpiricaMenuProps = {
-  position: "top-left" | "top-right" | "bottom-left" | "bottom-right";
+  position:
+    | "top"
+    | "top-left"
+    | "top-right"
+    | "bottom"
+    | "bottom-left"
+    | "bottom-right";
 };
 
 export function EmpiricaMenu({ position = "bottom-left" }: EmpiricaMenuProps) {
@@ -20,14 +26,20 @@ export function EmpiricaMenu({ position = "bottom-left" }: EmpiricaMenuProps) {
   }
 
   let className =
-    "backdrop-blur-md bg-gray-200 rounded fixed z-20 flex space-x-1 text-gray-500";
+    "backdrop-blur-md bg-gray-200/50 rounded fixed z-20 flex space-x-1 text-gray-500";
   switch (position) {
+    case "top":
+      className += " top-0 mt-2 ml-1/2 -translate-x-1/2";
+      break;
     case "top-left":
       className += " top-0 left-0 mt-2 ml-2";
       break;
     case "top-right":
       className += " top-0 right-0 mt-2 mr-2";
       break;
+    case "bottom":
+      className += " bottom-0 mb-2 ml-1/2 -translate-x-1/2";
+      break;
     case "bottom-right":
       className += " bottom-0 right-0 mb-2 mr-2";
       break;
@@ -50,10 +62,17 @@ export function EmpiricaMenu({ position = "bottom-left" }: EmpiricaMenuProps) {
       icon: (
         <svg
           xmlns="http://www.w3.org/2000/svg"
-          className="h-full w-full fill-current"
-          viewBox="0 0 640 512"
+          viewBox="0 0 24 24"
+          fill="none"
+          strokeWidth="2"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          className="h-full w-full stroke-current"
         >
-          <path d="M96 128a128 128 0 1 1 256 0A128 128 0 1 1 96 128zM0 482.3C0 383.8 79.8 304 178.3 304h91.4C368.2 304 448 383.8 448 482.3c0 16.4-13.3 29.7-29.7 29.7H29.7C13.3 512 0 498.7 0 482.3zM504 312V248H440c-13.3 0-24-10.7-24-24s10.7-24 24-24h64V136c0-13.3 10.7-24 24-24s24 10.7 24 24v64h64c13.3 0 24 10.7 24 24s-10.7 24-24 24H552v64c0 13.3-10.7 24-24 24s-24-10.7-24-24z" />
+          <path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" />
+          <circle cx="9" cy="7" r="4" />
+          <line x1="19" x2="19" y1="8" y2="14" />
+          <line x1="22" x2="16" y1="11" y2="11" />
         </svg>
       ),
       inDevOnly: true,
@@ -64,10 +83,15 @@ export function EmpiricaMenu({ position = "bottom-left" }: EmpiricaMenuProps) {
       icon: (
         <svg
           xmlns="http://www.w3.org/2000/svg"
-          className="h-full w-full fill-current"
-          viewBox="0 0 448 512"
+          viewBox="0 0 24 24"
+          fill="none"
+          strokeWidth="2"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          className="h-full w-full stroke-current"
         >
-          <path d="M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z" />
+          <path d="M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" />
+          <path d="M3 3v5h5" />
         </svg>
       ),
       inDevOnly: true,
@@ -80,10 +104,14 @@ export function EmpiricaMenu({ position = "bottom-left" }: EmpiricaMenuProps) {
       icon: (
         <svg
           xmlns="http://www.w3.org/2000/svg"
-          className="h-full w-full fill-current"
-          viewBox="0 0 512 512"
+          viewBox="0 0 24 24"
+          fill="none"
+          strokeWidth="2"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          className="h-full w-full stroke-current"
         >
-          <path d="M78.6 5C69.1-2.4 55.6-1.5 47 7L7 47c-8.5 8.5-9.4 22-2.1 31.6l80 104c4.5 5.9 11.6 9.4 19 9.4h54.1l109 109c-14.7 29-10 65.4 14.3 89.6l112 112c12.5 12.5 32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3l-112-112c-24.2-24.2-60.6-29-89.6-14.3l-109-109V104c0-7.5-3.5-14.5-9.4-19L78.6 5zM19.9 396.1C7.2 408.8 0 426.1 0 444.1C0 481.6 30.4 512 67.9 512c18 0 35.3-7.2 48-19.9L233.7 374.3c-7.8-20.9-9-43.6-3.6-65.1l-61.7-61.7L19.9 396.1zM512 144c0-10.5-1.1-20.7-3.2-30.5c-2.4-11.2-16.1-14.1-24.2-6l-63.9 63.9c-3 3-7.1 4.7-11.3 4.7H352c-8.8 0-16-7.2-16-16V102.6c0-4.2 1.7-8.3 4.7-11.3l63.9-63.9c8.1-8.1 5.2-21.8-6-24.2C388.7 1.1 378.5 0 368 0C288.5 0 224 64.5 224 144l0 .8 85.3 85.3c36-9.1 75.8 .5 104 28.7L429 274.5c49-23 83-72.8 83-130.5zM56 432a24 24 0 1 1 48 0 24 24 0 1 1 -48 0z" />
+          <path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" />
         </svg>
       ),
       inDevOnly: true,
@@ -96,10 +124,15 @@ export function EmpiricaMenu({ position = "bottom-left" }: EmpiricaMenuProps) {
       icon: (
         <svg
           xmlns="http://www.w3.org/2000/svg"
-          className="h-full w-full fill-current"
-          viewBox="0 0 448 512"
+          viewBox="0 0 24 24"
+          fill="none"
+          strokeWidth="2"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          className="h-full w-full stroke-current"
         >
-          <path d="M96 0C43 0 0 43 0 96V416c0 53 43 96 96 96H384h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V384c17.7 0 32-14.3 32-32V32c0-17.7-14.3-32-32-32H384 96zm0 384H352v64H96c-17.7 0-32-14.3-32-32s14.3-32 32-32zm32-240c0-8.8 7.2-16 16-16H336c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16zm16 48H336c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16s7.2-16 16-16z" />
+          <path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z" />
+          <path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z" />
         </svg>
       ),
       inDevOnly: true,

lib/admin-ui/src/style.css

@@ -1,3 +1,10 @@
+@layer base {
+  button {
+    -webkit-appearance: none !important;
+    background-color: transparent;
+  }
+}
+
 @layer utilities {
   /* Chrome, Safari, Edge, Opera */
   input.number-arrows-none::-webkit-outer-spin-button,

lib/admin-ui/uno.config.ts

@@ -1,3 +1,4 @@
+import { presetForms } from "@julr/unocss-preset-forms";
 import {
   defineConfig,
   presetAttributify,
@@ -8,9 +9,18 @@ import {
   transformerDirectives,
   transformerVariantGroup,
 } from "unocss";
-import { presetForms } from "@julr/unocss-preset-forms";
 
 export default defineConfig({
+  safelist: [
+    ...["blue", "green", "yellow", "grey"]
+      .map((color) => [
+        `border-${color}-600`,
+        `text-${color}-600`,
+        `bg-${color}-600`,
+        `hover:bg-${color}-700`,
+      ])
+      .flat(),
+  ],
   theme: {
     colors: {
       empirica: {
@@ -30,14 +40,14 @@ export default defineConfig({
   presets: [
     presetUno(),
     presetForms(),
-    presetAttributify(),
-    presetIcons(),
+    // presetAttributify(),
+    // presetIcons(),
     presetTypography(),
-    presetWebFonts({
-      fonts: {
-        // ...
-      },
-    }),
+    // presetWebFonts({
+    //   fonts: {
+    //     // ...
+    //   },
+    // }),
   ],
   transformers: [transformerDirectives(), transformerVariantGroup()],
 });