[playground] Use cursor for clickable elements (#16833)

.github/workflows/publish-knot-playground.yml

@@ -1,5 +1,5 @@
 # Publish the Red Knot playground.
-name: "[Playground] Release"
+name: "[Knot Playground] Release"
 
 permissions: {}
 

playground/api/src/index.ts

@@ -40,8 +40,7 @@ export default {
     const { DEV, PLAYGROUND } = env;
 
     const headers = DEV ? DEVELOPMENT_HEADERS : PRODUCTION_HEADERS;
-
-    if (!DEV && request.url.startsWith("https://playknot.ruff.rs")) {
+    if (!DEV && request.headers.get("origin") === "https://playknot.ruff.rs") {
       headers["Access-Control-Allow-Origin"] = "https://playknot.ruff.rs";
     }
 

playground/knot/src/Editor/Files.tsx

@@ -64,7 +64,7 @@ export function Files({
           <button
             disabled={lastFile}
             onClick={lastFile ? undefined : () => onRemove(id)}
-            className={"inline-block disabled:opacity-50"}
+            className={"inline-block disabled:opacity-50 cursor-pointer"}
             title="Close file"
           >
             <span className="sr-only">Close</span>
@@ -73,7 +73,11 @@ export function Files({
         </ListItem>
       ))}
       <ListItem selected={false} theme={theme}>
-        <button onClick={handleAdd} title="Add file" className="inline-block">
+        <button
+          onClick={handleAdd}
+          title="Add file"
+          className="inline-block cursor-pointer"
+        >
           <span className="sr-only">Add file</span>
           <Icons.Add />
         </button>
@@ -143,7 +147,7 @@ function FileEntry({ name, onClicked, onRenamed, selected }: FileEntryProps) {
           onClicked();
         }
       }}
-      className="flex gap-2 items-center py-4"
+      className="flex gap-2 items-center py-4 cursor-pointer"
     >
       <span className="inline-block flex-none" aria-hidden>
         <Icons.Python width={12} height={12} />

playground/shared/src/AstralButton.tsx

@@ -18,6 +18,7 @@ export default function AstralButton({
         "text-black",
         "hover:text-white",
         "hover:bg-galaxy",
+        "cursor-pointer",
         "outline-1",
         "dark:outline",
         "dark:hover:outline-white",

playground/shared/src/SideBar.tsx

@@ -40,7 +40,7 @@ export function SideBarEntry({
       aria-label={title}
       onClick={onClick}
       role="button"
-      className={`group py-4 px-2 relative flex items-center justify-center flex-col fill-white text-white ${
+      className={`group py-4 px-2 relative flex items-center justify-center flex-col fill-white text-white cursor-pointer ${
         selected ? "opacity-100" : "opacity-50 hover:opacity-100"
       }`}
     >