Release v1.32.1 (#849)

- PLU-406: always show delete button on mobile]
- PLU-405: only display executions for single pipe

Author: pregnantboy

package-lock.json

@@ -105,5 +105,5 @@
     "tsconfig-paths": "^4.2.0",
     "type-fest": "4.10.3"
   },
-  "version": "1.32.0"
+  "version": "1.32.1"
 }

packages/backend/package.json

@@ -11,24 +11,18 @@ const getExecutions: QueryResolvers['getExecutions'] = async (
 ) => {
   const filterBuilder = (builder: ExtendedQueryBuilder<Execution>) => {
     builder.where('test_run', 'FALSE')
+    builder.where('flow_id', params.flowId)
+
     if (!('status' in params)) {
       builder.whereNull('status')
     }
     if (params.status) {
       builder.where('status', params.status)
     }
-    if (params.searchInput) {
-      builder.where('name', 'ilike', `%${params.searchInput}%`)
-    }
   }
 
   const executionsQuery = context.currentUser
     .$relatedQuery('executions')
-    .withGraphFetched({
-      flow: {
-        steps: true,
-      },
-    })
     .where(filterBuilder)
     .orderBy('created_at', 'desc')
 

packages/backend/src/graphql/queries/get-executions.ts

@@ -25,8 +25,8 @@ type Query {
   getExecutions(
     limit: Int!
     offset: Int!
+    flowId: String!
     status: String
-    searchInput: String
   ): PaginatedExecutions
   getExecutionSteps(
     executionId: String!

packages/backend/src/graphql/schema.graphql

@@ -14,14 +14,16 @@ function truncateFlowName(flowName: string) {
     : flowName
 }
 
-export function createBodyErrorMessage(flowName: string): string {
+export function createBodyErrorMessage(
+  flowName: string,
+  pipeId: string,
+): string {
   const currDateTime = DateTime.now().toFormat('MMM dd yyyy, hh:mm a')
   const searchParams = new URLSearchParams()
   searchParams.set('status', 'failure')
-  searchParams.set('input', flowName)
 
   const appPrefixUrl = appConfig.isDev ? appConfig.webAppUrl : appConfig.baseUrl
-  const redirectUrl = `/executions?${searchParams.toString()}`
+  const redirectUrl = `/execution-pipe/${pipeId}?${searchParams.toString()}`
   const formattedUrl = `${appPrefixUrl}${redirectUrl}`
 
   const bodyMessage = `
@@ -76,7 +78,7 @@ export async function sendErrorEmail(flow: Flow) {
 
   await sendEmail({
     subject: `Plumber: Possible error on ${truncatedFlowName}`,
-    body: createBodyErrorMessage(truncatedFlowName),
+    body: createBodyErrorMessage(truncatedFlowName, flowId),
     recipient: userEmail,
     replyTo: '[email protected]',
   })

packages/backend/src/helpers/generate-error-email.ts

@@ -1,6 +1,6 @@
 {
   "name": "frontend",
-  "version": "1.32.0",
+  "version": "1.32.1",
   "scripts": {
     "dev": "wait-on tcp:3000 && vite --host --force",
     "build": "tsc && vite build --mode=${VITE_MODE:-prod}",

packages/frontend/package.json

@@ -1,6 +1,7 @@
 import type { IFlow } from '@plumber/types'
 
 import { ReactElement } from 'react'
+import { BiChevronRight } from 'react-icons/bi'
 import { Link } from 'react-router-dom'
 import {
   Card,
@@ -9,6 +10,7 @@ import {
   Grid,
   GridItem,
   HStack,
+  Icon,
   Text,
   VStack,
 } from '@chakra-ui/react'
@@ -22,10 +24,18 @@ import FlowContextMenu from './FlowContextMenu'
 
 type FlowRowProps = {
   flow: IFlow
+  isExecution?: boolean
+  showMenu?: boolean
+  showTimestamp?: boolean
 }
 
 export default function FlowRow(props: FlowRowProps): ReactElement {
-  const { flow } = props
+  const {
+    flow,
+    showMenu = true,
+    showTimestamp = true,
+    isExecution = false,
+  } = props
 
   const createdAt = DateTime.fromMillis(parseInt(flow.createdAt, 10))
   const updatedAt = DateTime.fromMillis(parseInt(flow.updatedAt, 10))
@@ -42,12 +52,18 @@ export default function FlowRow(props: FlowRowProps): ReactElement {
         borderRadius={0}
         borderBottom="1px solid"
         borderBottomColor="base.divider.medium"
+        minH={100}
       >
         <CardBody
           sx={{ cursor: 'pointer' }}
           p={0}
           as={Link}
-          to={URLS.FLOW(flow.id)}
+          to={
+            isExecution ? URLS.EXECUTIONS_FOR_FLOW(flow.id) : URLS.FLOW(flow.id)
+          }
+          display="flex"
+          alignItems="center"
+          justifyContent="stretch"
         >
           <Grid
             templateAreas={{
@@ -63,6 +79,7 @@ export default function FlowRow(props: FlowRowProps): ReactElement {
               md: 'calc(30px * 3 + 8px * 2) minmax(0, auto) min-content',
             }}
             gap={6}
+            flex={1}
             alignItems="center"
             py={6}
             px={{ base: 3, md: 8 }}
@@ -90,16 +107,18 @@ export default function FlowRow(props: FlowRowProps): ReactElement {
                 >
                   {flow?.name}
                 </Text>
-                <Text
-                  display="inline-block"
-                  w="100%"
-                  maxW="85%"
-                  color="base.content.medium"
-                  textStyle="body-2"
-                >
-                  {isUpdated && `updated ${relativeUpdatedAt}`}
-                  {!isUpdated && `created ${relativeCreatedAt}`}
-                </Text>
+                {showTimestamp && (
+                  <Text
+                    display="inline-block"
+                    w="100%"
+                    maxW="85%"
+                    color="base.content.medium"
+                    textStyle="body-2"
+                  >
+                    {isUpdated && `updated ${relativeUpdatedAt}`}
+                    {!isUpdated && `created ${relativeCreatedAt}`}
+                  </Text>
+                )}
               </VStack>
             </GridItem>
             <GridItem area="menu">
@@ -111,7 +130,11 @@ export default function FlowRow(props: FlowRowProps): ReactElement {
                   <Text>{flow?.active ? 'Published' : 'Draft'}</Text>
                 </Badge>
 
-                <FlowContextMenu flow={flow} />
+                {showMenu ? (
+                  <FlowContextMenu flow={flow} />
+                ) : (
+                  <Icon boxSize={5} as={BiChevronRight} />
+                )}
               </Flex>
             </GridItem>
           </Grid>

packages/frontend/src/components/FlowRow/index.tsx

@@ -1,5 +1,5 @@
 import { useContext } from 'react'
-import { Link, useMatch } from 'react-router-dom'
+import { Link, matchPath, useLocation } from 'react-router-dom'
 import { Box, Text } from '@chakra-ui/react'
 import {
   Badge,
@@ -20,8 +20,12 @@ function NavigationSidebarItem({
   link,
   closeDrawer,
 }: NavigationSidebarItemProps): JSX.Element {
-  const { to, Icon: icon, text } = link
-  const selected = useMatch({ path: to, end: true })
+  const { pathname } = useLocation()
+
+  const { to, Icon: icon, text, otherLinks } = link
+  const selected = [to, ...(otherLinks || [])].some((link) =>
+    matchPath(link, pathname),
+  )
 
   return (
     <SidebarItem

packages/frontend/src/components/Layout/NavigationSidebar.tsx

@@ -23,6 +23,7 @@ export type DrawerLink = {
   Icon: React.ElementType
   text: string
   to: string
+  otherLinks?: string[]
   isBottom?: boolean
   badge?: string
 }
@@ -47,6 +48,7 @@ const drawerLinks = [
     Icon: BiHistory,
     text: 'Executions',
     to: URLS.EXECUTIONS,
+    otherLinks: [URLS.EXECUTIONS_FOR_FLOW_PATTERN, URLS.EXECUTION_PATTERN],
   },
   {
     Icon: BiBookOpen,

packages/frontend/src/components/Layout/index.tsx

@@ -35,6 +35,8 @@ export interface SharedSelectContextReturnProps<
   isRefreshLoading?: boolean
   /** Controls if user can add one arbitrary item of their choosing. */
   freeSolo?: boolean
+  /** Variant of the select */
+  variant?: string
 }
 
 interface SelectContextReturn<Item extends ComboboxItem = ComboboxItem>