Merge pull request #2237 from quantified-uncertainty/version-pinning

Version pinning

.changeset/afraid-radios-taste.md

@@ -0,0 +1,6 @@
+---
+"@quri/ui": patch
+---
+
+- `WrenchIcon`
+- `DropdownMenuLinkItem` for `<a href=...>` links

.changeset/chilly-seals-float.md

@@ -0,0 +1,5 @@
+---
+"@quri/ui": patch
+---
+
+Expose DropdownMenuItemLayout component

.changeset/config.json

@@ -12,6 +12,11 @@
   "access": "public",
   "baseBranch": "main",
   "updateInternalDependencies": "patch",
-  "ignore": ["squiggle-website", "@quri/hub", "@quri/ops"],
-  "changelog": "../packages/ops/dist/changelog.js"
+  "ignore": [
+    "squiggle-website",
+    "@quri/hub",
+    "@quri/ops",
+    "@quri/versioned-playground"
+  ],
+  "changelog": "../packages/ops/dist/scripts/changelog.cjs"
 }

.changeset/fast-feet-happen.md

@@ -0,0 +1,5 @@
+---
+"@quri/ui": patch
+---
+
+FormField and ControlledFormField components accept standaloneLabel prop

.github/workflows/release.yml

@@ -1,6 +1,12 @@
 name: Release
 
-on: workflow_dispatch
+on:
+  workflow_dispatch:
+    inputs:
+      force-post-publish:
+        type: boolean
+        description: "Force post-publish script and PR even if nothing was published"
+        default: false
 
 # copy-pasted from ci.yml
 env:
@@ -50,8 +56,25 @@ jobs:
         with:
           title: New release
           version: pnpm run changeset-version
-          publish: pnpm run publish
+          publish: pnpm run publish-all
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
           VSCE_PAT: ${{ secrets.VSCE_PAT }}
+
+      - name: Extract published version
+        id: published-version
+        run: |
+          VERSION=$(cat packages/squiggle-lang/package.json | fgrep '"version"' | head -1 | perl -ne '/"version": "([^"]+)"/ && print $1')
+          echo "published-version=$VERSION" >> "$GITHUB_OUTPUT"
+
+      - name: Prepare for next release
+        if: steps.changesets.outputs.published == 'true' || inputs.force-post-publish
+        run: pnpm run post-publish
+
+      - name: Create PR with version patches
+        if: steps.changesets.outputs.published == 'true' || inputs.force-post-publish
+        uses: peter-evans/create-pull-request@v5
+        with:
+          commit-message: Bump versions after ${{ steps.published-version.outputs.published-version }} release
+          title: Bump versions after ${{ steps.published-version.outputs.published-version }} release

.gitignore

@@ -12,6 +12,7 @@ todo.txt
 result
 shell.nix
 .turbo
+*.tsbuildinfo
 
 .pnp.*
 .yarn/*

package.json

@@ -4,9 +4,9 @@
   "scripts": {
     "nodeclean": "rm -r node_modules && rm -r packages/*/node_modules",
     "preinstall": "npx only-allow pnpm",
-    "changeset-version": "cd packages/ops && pnpm run changeset-version",
-    "changeset": "changeset",
-    "publish": "turbo lint build && changeset publish && cd packages/vscode-ext && pnpm run package && npx vsce publish --no-dependencies --skip-duplicate"
+    "changeset-version": "cd packages/ops && turbo build && pnpm run changeset-version",
+    "publish-all": "cd packages/ops && turbo build && pnpm run publish-all",
+    "post-publish": "cd packages/ops && turbo build && pnpm run post-publish"
   },
   "devDependencies": {
     "@changesets/cli": "^2.26.2",

packages/components/.gitignore

@@ -25,4 +25,3 @@ storybook-static
 dist
 
 /.vscode
-/*.tsbuildinfo

packages/hub/package.json

@@ -30,6 +30,7 @@
     "@quri/squiggle-components": "workspace:*",
     "@quri/squiggle-lang": "workspace:*",
     "@quri/ui": "workspace:*",
+    "@quri/versioned-playground": "workspace:*",
     "@tailwindcss/typography": "^0.5.9",
     "base64-js": "^1.5.1",
     "clsx": "^2.0.0",

packages/hub/prisma/migrations/20230823211259_squiggle_version/migration.sql

@@ -0,0 +1,3 @@
+ALTER TABLE "SquiggleSnippet" ADD COLUMN     "version" TEXT;
+UPDATE "SquiggleSnippet" SET "version" = '0.8.5' WHERE "version" IS NULL;
+ALTER TABLE "SquiggleSnippet" ALTER COLUMN "version" SET NOT NULL;

packages/hub/prisma/schema.prisma

@@ -215,7 +215,8 @@ model ModelRevision {
 model SquiggleSnippet {
   id String @id @default(cuid())
 
-  code String
+  code    String
+  version String
 
   revision ModelRevision?
 }

packages/hub/schema.graphql

@@ -243,6 +243,7 @@ input MutationCreateSquiggleSnippetModelInput {
   """Defaults to false"""
   isPrivate: Boolean
   slug: String!
+  version: String!
 }
 
 union MutationCreateSquiggleSnippetModelResult = BaseError | CreateSquiggleSnippetModelResult | ValidationError
@@ -336,8 +337,7 @@ input MutationUpdateRelativeValuesDefinitionInput {
 union MutationUpdateRelativeValuesDefinitionResult = BaseError | UpdateRelativeValuesDefinitionResult
 
 input MutationUpdateSquiggleSnippetModelInput {
-  code: String @deprecated(reason: "Use content arg instead")
-  content: SquiggleSnippetContentInput
+  content: SquiggleSnippetContentInput!
   owner: String!
   relativeValuesExports: [RelativeValuesExportInput!]
   slug: String!
@@ -523,10 +523,12 @@ interface SquiggleOutput {
 type SquiggleSnippet implements Node {
   code: String!
   id: ID!
+  version: String!
 }
 
 input SquiggleSnippetContentInput {
   code: String!
+  version: String!
 }
 
 type UpdateGroupInviteRoleResult {

packages/hub/src/app/models/[owner]/[slug]/EditSquiggleSnippetModel.tsx

@@ -1,12 +1,9 @@
-import { FC, useMemo } from "react";
+import { FC, useMemo, useState } from "react";
 import { FormProvider, useFieldArray, useForm } from "react-hook-form";
 import { graphql, useFragment } from "react-relay";
 
-import {
-  PlaygroundToolbarItem,
-  SquigglePlayground,
-} from "@quri/squiggle-components";
-import { Button, LinkIcon, useToast } from "@quri/ui";
+import { PlaygroundToolbarItem } from "@quri/squiggle-components";
+import { Button, LinkIcon, TextTooltip, useToast } from "@quri/ui";
 
 import { EditSquiggleSnippetModel$key } from "@/__generated__/EditSquiggleSnippetModel.graphql";
 import {
@@ -17,6 +14,12 @@ import { EditModelExports } from "@/components/exports/EditModelExports";
 import { useAsyncMutation } from "@/hooks/useAsyncMutation";
 import { useAvailableHeight } from "@/hooks/useAvailableHeight";
 import { extractFromGraphqlErrorUnion } from "@/lib/graphqlHelpers";
+import {
+  SquigglePlaygroundVersionPicker,
+  VersionedSquigglePlayground,
+  type SquiggleVersion,
+  SquiggleVersionShower,
+} from "@quri/versioned-playground";
 
 export const Mutation = graphql`
   mutation EditSquiggleSnippetModelMutation(
@@ -67,6 +70,7 @@ export const EditSquiggleSnippetModel: FC<Props> = ({ modelRef }) => {
             ... on SquiggleSnippet {
               id
               code
+              version
             }
           }
 
@@ -111,6 +115,9 @@ export const EditSquiggleSnippetModel: FC<Props> = ({ modelRef }) => {
     defaultValues: initialFormValues,
   });
 
+  // could version picker be part of the form?
+  const [version, setVersion] = useState(content.version);
+
   const {
     fields: variablesWithDefinitionsFields,
     append: appendVariableWithDefinition,
@@ -134,6 +141,7 @@ export const EditSquiggleSnippetModel: FC<Props> = ({ modelRef }) => {
         input: {
           content: {
             code: formData.code,
+            version,
           },
           relativeValuesExports: formData.relativeValuesExports,
           slug: model.slug,
@@ -148,22 +156,53 @@ export const EditSquiggleSnippetModel: FC<Props> = ({ modelRef }) => {
     form.setValue("code", code);
   };
 
+  // We don't want to control SquigglePlayground, it's uncontrolled by design.
+  // Instead, we reset the `defaultCode` that we pass to it when version is changed.
+  const [defaultCode, setDefaultCode] = useState(content.code);
+
+  const handleVersionChange = (newVersion: SquiggleVersion) => {
+    setVersion(newVersion);
+    setDefaultCode(form.getValues("code"));
+  };
+
   return (
     <FormProvider {...form}>
       <form onSubmit={save}>
         <div ref={ref}>
-          <SquigglePlayground
+          <VersionedSquigglePlayground
+            version={version}
             height={height ?? "100vh"}
             onCodeChange={onCodeChange}
-            defaultCode={content.code}
-            renderExtraControls={({ openModal }) =>
-              model.isEditable && (
-                <div className="h-full flex items-center justify-end gap-2">
+            defaultCode={defaultCode}
+            renderExtraControls={({ openModal }) => (
+              <div className="h-full flex items-center justify-end gap-2">
+                {model.isEditable && (
                   <PlaygroundToolbarItem
-                    tooltipText={"Exported Variables"}
+                    tooltipText="Exported Variables"
                     icon={LinkIcon}
                     onClick={() => openModal("exports")}
-                  ></PlaygroundToolbarItem>
+                  />
+                )}
+                {model.isEditable ? (
+                  <SquigglePlaygroundVersionPicker
+                    version={version}
+                    onChange={handleVersionChange}
+                    size="small"
+                    showUpdatePolicy
+                  />
+                ) : (
+                  <TextTooltip
+                    text="Squiggle Version" // FIXME - positioning is bad for some reason
+                    placement="bottom"
+                    offset={5}
+                  >
+                    {/* div wrapper is required because TextTooltip clones its children and SquiggleVersionShower doesn't forwardRef */}
+                    <div>
+                      <SquiggleVersionShower version={version} />
+                    </div>
+                  </TextTooltip>
+                )}
+                {model.isEditable && (
                   <Button
                     theme="primary"
                     onClick={save}
@@ -172,9 +211,9 @@ export const EditSquiggleSnippetModel: FC<Props> = ({ modelRef }) => {
                   >
                     Save
                   </Button>
-                </div>
-              )
-            }
+                )}
+              </div>
+            )}
             renderExtraModal={(name) => {
               if (name === "exports") {
                 return {

packages/hub/src/app/models/[owner]/[slug]/ModelLayout.tsx

@@ -16,7 +16,7 @@ import {
 
 import { ModelLayoutQuery } from "@/__generated__/ModelLayoutQuery.graphql";
 import { EntityLayout } from "@/components/EntityLayout";
-import { DropdownMenuLinkItem } from "@/components/ui/DropdownMenuLinkItem";
+import { DropdownMenuNextLinkItem } from "@/components/ui/DropdownMenuNextLinkItem";
 import { EntityTab } from "@/components/ui/EntityTab";
 import { extractFromGraphqlErrorUnion } from "@/lib/graphqlHelpers";
 import { SerializablePreloadedQuery } from "@/relay/loadPageQuery";
@@ -87,7 +87,7 @@ export const ModelLayout: FC<
       <DropdownMenuHeader>Relative Value Functions</DropdownMenuHeader>
       <DropdownMenuSeparator />
       {model.currentRevision.relativeValuesExports.map((exportItem) => (
-        <DropdownMenuLinkItem
+        <DropdownMenuNextLinkItem
           key={exportItem.variableName}
           href={modelForRelativeValuesExportRoute({
             owner: model.owner.slug,

packages/hub/src/app/models/[owner]/[slug]/relative-values/[variableName]/RelativeValuesModelRevision.ts

@@ -11,6 +11,7 @@ export const RelativeValuesModelRevisionFragment = graphql`
       ... on SquiggleSnippet {
         id
         code
+        version
       }
     }
 

packages/hub/src/app/models/[owner]/[slug]/revisions/[revisionId]/ModelRevisionView.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { format } from "date-fns";
 import { FC } from "react";
 import { graphql } from "relay-runtime";
 
@@ -10,8 +11,7 @@ import { SerializablePreloadedQuery } from "@/relay/loadPageQuery";
 import { usePageQuery } from "@/relay/usePageQuery";
 import { modelRoute } from "@/routes";
 import { ModelRevisionViewQuery } from "@gen/ModelRevisionViewQuery.graphql";
-import { SquigglePlayground } from "@quri/squiggle-components";
-import { format } from "date-fns";
+import { VersionedSquigglePlayground } from "@quri/versioned-playground";
 
 const Query = graphql`
   query ModelRevisionViewQuery($input: QueryModelInput!, $revisionId: ID!) {
@@ -35,6 +35,7 @@ const Query = graphql`
             __typename
             ... on SquiggleSnippet {
               code
+              version
             }
           }
         }
@@ -65,12 +66,17 @@ export const ModelRevisionView: FC<{
         <div className="pt-4 pb-8 px-8">
           <div>
             <span className="text-slate-500">Version from</span>{" "}
-            {format(model.revision.createdAtTimestamp, commonDateFormat)}
+            {format(model.revision.createdAtTimestamp, commonDateFormat)}.{" "}
+            <span className="text-slate-500">Squiggle</span>{" "}
+            {model.revision.content.version}.
           </div>
           <StyledLink href={modelUrl}>Go to latest version</StyledLink>
         </div>
       </div>
-      <SquigglePlayground defaultCode={model.revision.content.code} />
+      <VersionedSquigglePlayground
+        defaultCode={model.revision.content.code}
+        version={model.revision.content.version}
+      />
     </div>
   );
 };

packages/hub/src/app/new/model/NewModel.tsx

@@ -6,6 +6,7 @@ import { FormProvider, useForm } from "react-hook-form";
 import { graphql } from "relay-runtime";
 
 import { Button, CheckboxFormField } from "@quri/ui";
+import { defaultSquiggleVersion } from "@quri/versioned-playground";
 
 import { NewModelMutation } from "@/__generated__/NewModelMutation.graphql";
 import { SelectGroup, SelectGroupOption } from "@/components/SelectGroup";
@@ -75,6 +76,7 @@ export const NewModel: FC = () => {
           groupSlug: data.group?.slug,
           isPrivate: data.isPrivate,
           code: defaultCode,
+          version: defaultSquiggleVersion,
         },
       },
       onCompleted: (result) => {
@@ -97,7 +99,7 @@ export const NewModel: FC = () => {
     <form onSubmit={save}>
       <FormProvider {...form}>
         <H1>New Model</H1>
-        <div className="mb-4 space-y-4">
+        <div className="space-y-4 mb-4 mt-4">
           <SlugFormField<FormShape>
             name="slug"
             example="my-long-model"

packages/hub/src/components/layout/RootLayout/PageMenuLink.tsx

@@ -1,8 +1,8 @@
 import Link from "next/link";
 import { FC } from "react";
 
+import { DropdownMenuNextLinkItem } from "@/components/ui/DropdownMenuNextLinkItem";
 import { IconProps } from "@/relative-values/components/ui/icons/Icon";
-import { DropdownMenuLinkItem } from "@/components/ui/DropdownMenuLinkItem";
 import { EmptyIcon } from "@quri/ui";
 
 export type MenuLinkModeProps =
@@ -41,7 +41,7 @@ export const PageMenuLink: FC<Props> = ({
       {title}
     </Link>
   ) : (
-    <DropdownMenuLinkItem
+    <DropdownMenuNextLinkItem
       href={href}
       icon={icon ?? EmptyIcon}
       title={title}