Skip to content

Commit

Permalink
fix: changes to Raven Scheduler Event
Browse files Browse the repository at this point in the history
  • Loading branch information
@yjane99
yjane99 committed Apr 12, 2024
1 parent e48f684 commit bd887ee
Show file tree
Hide file tree
Showing 4 changed files with 48 additions and 72 deletions.
14 changes: 7 additions & 7 deletions raven-app/src/components/feature/settings/scheduler-events/SchedulerEventsForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ export const SchedulerEventsForm = ({ edit = false }: Props) => {
const frequency = watch('event_frequency')

return (
<Flex direction="column" gap={'5'}>
<Flex direction="column" gap={'4'}>
{!edit && <Box>
<Label htmlFor="event_name" isRequired>Name</Label>
<TextField.Root>
Expand All @@ -55,8 +55,8 @@ export const SchedulerEventsForm = ({ edit = false }: Props) => {
<Controller
control={control}
name="channel"
render={({ field }) => (
<Select.Root {...field} onValueChange={(value) => field.onChange(value)}>
render={({ field: { onChange, value } }) => (
<Select.Root onValueChange={(value) => onChange(value)} value={value}>
<Select.Trigger style={{ width: "100%" }} placeholder="Select Channel" autoFocus={edit} />
<Select.Content>
<Select.Group>
Expand All @@ -80,8 +80,8 @@ export const SchedulerEventsForm = ({ edit = false }: Props) => {
<Controller
control={control}
name="bot"
render={({ field }) => (
<Select.Root {...field} onValueChange={(value) => field.onChange(value)}>
render={({ field: { onChange, value } }) => (
<Select.Root onValueChange={(value) => onChange(value)} value={value}>
<Select.Trigger style={{ width: "100%" }} placeholder="Select Bot" />
<Select.Content>
<Select.Group>
Expand All @@ -104,8 +104,8 @@ export const SchedulerEventsForm = ({ edit = false }: Props) => {
<Controller
control={control}
name="event_frequency"
render={({ field }) => (
<Select.Root {...field} onValueChange={(value) => field.onChange(value)}>
render={({ field: { onChange, value } }) => (
<Select.Root onValueChange={(value) => onChange(value)} value={value}>
<Select.Trigger style={{ width: "100%" }} placeholder="Select Frequency" />
<Select.Content>
<Select.Group>
Expand Down
14 changes: 7 additions & 7 deletions raven-app/src/pages/settings/ServerScripts/SchedulerEvents/CreateSchedulerEvent.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { BackToList } from "@/components/feature/integrations/webhooks/BackToList"
import { SchedulerEventForm, SchedulerEventsForm } from "@/components/feature/settings/scheduler-events/SchedulerEventsForm"
import { ErrorBanner } from "@/components/layout/AlertBanner"
import { useToast } from "@/hooks/useToast"
Expand All @@ -7,7 +8,7 @@ import { FormProvider, useForm } from "react-hook-form"
import { FiArrowLeft } from "react-icons/fi"
import { useNavigate } from "react-router-dom"

export const CreateSchedulerEvent = () => {
const CreateSchedulerEvent = () => {

const navigate = useNavigate()

Expand All @@ -31,7 +32,6 @@ export const CreateSchedulerEvent = () => {
if (data.event_frequency === 'Cron') {
cron_expression = `${data.minute} ${data.hour} ${data.date} ${data.month} ${data.day}`
}
// console.log(data, cron_expression)
createDoc('Raven Scheduler Event', {
event_name: data.event_name,
disabled: 0,
Expand All @@ -45,7 +45,7 @@ export const CreateSchedulerEvent = () => {
})
.then((doc) => {
if (doc) {
navigate(`../${doc?.name}`)
navigate(`../scheduled-messages/${doc?.name}`)
}
toast({
title: `Temporal Event created`,
Expand All @@ -58,9 +58,7 @@ export const CreateSchedulerEvent = () => {
<FormProvider {...methods}>
<form onSubmit={methods.handleSubmit(onSubmit)}>
<Box className="lg:mx-[10rem] md:mx-[5rem] mt-9 h-screen">
<Button variant="ghost" color="gray" onClick={() => navigate('../../scheduled-messages')}>
<FiArrowLeft /> Scheduled Messages
</Button>
<BackToList label="Scheduled Messages" path="/settings/integrations/scheduled-messages" />
<Flex justify={'between'} mt={'6'}>
<Heading>New Scheduled Message</Heading>
<Button type='submit'>Save</Button>
Expand All @@ -73,4 +71,6 @@ export const CreateSchedulerEvent = () => {
</form>
</FormProvider>
)
}
}

export const Component = CreateSchedulerEvent
59 changes: 14 additions & 45 deletions raven-app/src/pages/settings/ServerScripts/SchedulerEvents/SchedulerEvents.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,24 +1,29 @@
import { ErrorBanner } from "@/components/layout/AlertBanner"
import { FullPageLoader } from "@/components/layout/Loaders"
import { RavenSchedulerEvent } from "@/types/RavenIntegrations/RavenSchedulerEvent"
import { DateMonthAtHourMinuteAmPm } from "@/utils/dateConversions"
import { Box, Flex, Heading, Button, Section, Blockquote, Badge, Card, Table, Text, Code } from "@radix-ui/themes"
import { useFrappeGetDocList } from "frappe-react-sdk"
import { Box, Flex, Heading, Button, Section, Blockquote, Text } from "@radix-ui/themes"
import { useFrappeDocTypeEventListener, useFrappeGetDocList } from "frappe-react-sdk"
import { Link, useNavigate } from "react-router-dom"
import { List } from "./ScheduledMessageList"

export interface Props { }

export const TemporalEvents = (props: Props) => {
const SchedulerEvents = (props: Props) => {

const navigate = useNavigate()

const { data, error } = useFrappeGetDocList<RavenSchedulerEvent>('Raven Scheduler Event', {
fields: ['name', 'disabled', 'event_frequency', 'modified'],
const { data, error, isLoading, mutate } = useFrappeGetDocList<RavenSchedulerEvent>('Raven Scheduler Event', {
fields: ['name', 'disabled', 'event_frequency', 'creation', 'owner'],
orderBy: {
field: 'modified',
order: 'desc'
}
})

useFrappeDocTypeEventListener('Raven Scheduler Event', () => {
mutate()
})

return (
<Box className="lg:mx-[10rem] md:mx-[5rem] mt-9 h-screen">
<Flex justify={'between'}>
Expand All @@ -30,52 +35,16 @@ export const TemporalEvents = (props: Props) => {
Lets say you want to be reminded to file your GST returns every month on the 10th. You can create a scheduled message & a bot will remind you to do so.
</Blockquote>
</Section>
<Flex>
<Flex direction={'column'}>
{error && <ErrorBanner error={error} />}
{isLoading && <FullPageLoader className="h-auto" text='Loading...' />}
{data?.length === 0 ? <EmptyState /> : <List data={data ?? []} />}
</Flex>
</Box>
)
}


const List = ({ data }: { data: RavenSchedulerEvent[] }) => {
return (
<Box width={'100%'}>
<Card>
<Table.Root>
<Table.Header>
<Table.Row>
<Table.ColumnHeaderCell>ID</Table.ColumnHeaderCell>
<Table.ColumnHeaderCell>Status</Table.ColumnHeaderCell>
<Table.ColumnHeaderCell>Frequency</Table.ColumnHeaderCell>
<Table.ColumnHeaderCell>Last modified</Table.ColumnHeaderCell>
</Table.Row>
</Table.Header>

<Table.Body>
{data?.map((item: any) => (<Table.Row key={item.name}>
<Table.RowHeaderCell>
<Link to={`${item.name}`}>
<Text weight={'medium'} className="hover:underline">{item.name}</Text>
</Link>
</Table.RowHeaderCell>
<Table.Cell>
<Badge color={item.disabled ? 'gray' : 'green'}>{item.disabled ? "Disabled" : "Enabled"}</Badge>
</Table.Cell>
<Table.Cell>
<Code>{item.event_frequency}</Code>
</Table.Cell>
<Table.Cell>
<DateMonthAtHourMinuteAmPm date={item.modified} />
</Table.Cell>
</Table.Row>))}
</Table.Body>
</Table.Root>
</Card>
</Box>
)
}
export const Component = SchedulerEvents


const EmptyState = () => {
Expand Down
33 changes: 20 additions & 13 deletions raven-app/src/pages/settings/ServerScripts/SchedulerEvents/ViewSchedulerEvent.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,19 @@
import { BackToList } from "@/components/feature/integrations/webhooks/BackToList"
import { DeleteAlert } from "@/components/feature/settings/common/DeleteAlert"
import { SchedulerEventsForm } from "@/components/feature/settings/scheduler-events/SchedulerEventsForm"
import { ErrorBanner } from "@/components/layout/AlertBanner"
import { useToast } from "@/hooks/useToast"
import { Badge, Box, Button, DropdownMenu, Flex, Heading, Section } from "@radix-ui/themes"
import { Badge, Box, Button, DropdownMenu, Flex, Heading, IconButton, Section } from "@radix-ui/themes"
import { useFrappeGetDoc, useFrappeUpdateDoc } from "frappe-react-sdk"
import { useState } from "react"
import { FormProvider, useForm } from "react-hook-form"
import { BiDotsVerticalRounded } from "react-icons/bi"
import { FiArrowLeft, FiChevronDown } from "react-icons/fi"
import { useNavigate, useParams } from "react-router-dom"

export interface Props { }

export const ViewSchedulerEvent = (props: Props) => {
const ViewSchedulerEvent = (props: Props) => {

const { ID } = useParams<{ ID: string }>()

Expand Down Expand Up @@ -49,11 +51,12 @@ const ViewSchedulerEventPage = ({ data, onUpdate }: { data: any, onUpdate: () =>
}
})

const { updateDoc, error } = useFrappeUpdateDoc()
const { updateDoc, error, loading } = useFrappeUpdateDoc()

const { toast } = useToast()

const onSubmit = (data: any) => {
console.log('called')
let cron_expression = ''
if (data.event_frequency === 'Every Day') {
cron_expression = `${data.minute} ${data.hour} * * *`
Expand Down Expand Up @@ -104,21 +107,24 @@ const ViewSchedulerEventPage = ({ data, onUpdate }: { data: any, onUpdate: () =>
<FormProvider {...methods}>
<form onSubmit={methods.handleSubmit(onSubmit)}>
<Box className="lg:mx-[10rem] md:mx-[5rem] mt-9 h-screen">
<Button variant="ghost" color="gray" onClick={() => navigate('../../scheduled-messages')}>
<FiArrowLeft /> Scheduled Messages
</Button>
<BackToList label="Scheduled Messages" path="/settings/integrations/scheduled-messages" />
<Flex justify={'between'} mt={'6'}>
<Flex align={'center'} gap={'3'}>
<Heading>{data.name}</Heading>
<Badge color={data.disabled ? 'gray' : 'green'}>{data.disabled ? "Disabled" : "Enabled"}</Badge>
</Flex>
<Flex gap={'3'}>
<Button onClick={() => methods.handleSubmit(onSubmit)} disabled={loading || !methods.formState.isDirty}>Save</Button>
<DropdownMenu.Root>
<DropdownMenu.Trigger>
<Button variant="soft" color="gray">
Actions
<FiChevronDown />
</Button>
<IconButton aria-label='Options' variant="soft" color="gray" style={{
// @ts-ignore
'--icon-button-ghost-padding': '0',
height: 'var(--base-button-height)',
width: 'var(--base-button-height)',
}}>
<BiDotsVerticalRounded />
</IconButton>
</DropdownMenu.Trigger>
<DropdownMenu.Content>
<DropdownMenu.Item onClick={onStatusToggle}>{data.disabled ? "Enable" : "Disable"}</DropdownMenu.Item>
Expand All @@ -128,8 +134,7 @@ const ViewSchedulerEventPage = ({ data, onUpdate }: { data: any, onUpdate: () =>
</DropdownMenu.Item>
</DropdownMenu.Content>
</DropdownMenu.Root>
<DeleteAlert docname={data.name} isOpen={isOpen} onClose={onClose} path={'../../scheduled-messages'} />
<Button type='submit'>Save</Button>
<DeleteAlert doctype="Raven Scheduler Event" docname={data.name} isOpen={isOpen} onClose={onClose} path={'../../scheduled-messages'} />
</Flex>
</Flex>
<Section size={'2'}>
Expand All @@ -140,4 +145,6 @@ const ViewSchedulerEventPage = ({ data, onUpdate }: { data: any, onUpdate: () =>
</form>
</FormProvider>
)
}
}

export const Component = ViewSchedulerEvent

0 comments on commit bd887ee

Please sign in to comment.