⚡ (setVariable) Add Pop and Shift items

apps/builder/src/features/blocks/logic/setVariable/components/SetVariableContent.tsx

@@ -62,7 +62,19 @@ const Expression = ({
       )
     }
     case 'Empty':
-      return <Text as="span">Reset {variableName}</Text>
+      return <Text as="span">Reset {variableName} </Text>
+    case 'Shift':
+    case 'Pop': {
+      const itemVariableName = variables.find(
+        byId(options.saveItemInVariableId)
+      )?.name
+      return (
+        <Text as="span">
+          {options.type} {variableName}
+          {itemVariableName ? ` into ${itemVariableName}` : ''}
+        </Text>
+      )
+    }
     case 'Random ID':
     case 'Today':
     case 'Now':

apps/builder/src/features/blocks/logic/setVariable/components/SetVariableSettings.tsx

@@ -132,6 +132,14 @@ const SetVariableValue = ({
       isExecutedOnClient,
     })
 
+  const updateListVariableId = (variable?: Pick<Variable, 'id'>) => {
+    if (!options || (options.type !== 'Pop' && options.type !== 'Shift')) return
+    onOptionsChange({
+      ...options,
+      saveItemInVariableId: variable?.id,
+    })
+  }
+
   const updateItemVariableId = (variable?: Pick<Variable, 'id'>) => {
     if (!options || options.type !== 'Map item with same index') return
     onOptionsChange({
@@ -222,6 +230,17 @@ const SetVariableValue = ({
           </Stack>
         </>
       )
+    case 'Pop':
+    case 'Shift':
+      return (
+        <VariableSearchInput
+          initialVariableId={options.saveItemInVariableId}
+          onSelectVariable={updateListVariableId}
+          placeholder={
+            options.type === 'Shift' ? 'Shifted item' : 'Popped item'
+          }
+        />
+      )
     case 'Map item with same index': {
       return (
         <Stack p="2" rounded="md" borderWidth={1}>