diff --git a/frontend/package.json b/frontend/package.json
index 3c0709e444..d0db56eee9 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -118,7 +118,6 @@
"svelte-exmarkdown": "^2.1.0",
"svelte-infinite-loading": "^1.3.8",
"svelte-portal": "^2.2.0",
- "svelte-timezone-picker": "^2.0.3",
"svelte-tiny-virtual-list": "^2.0.5",
"tailwind-merge": "^1.13.2",
"vscode-ws-jsonrpc": "3.0.0",
diff --git a/frontend/src/lib/components/CronInput.svelte b/frontend/src/lib/components/CronInput.svelte
index 7b70f1a1f6..e96a6a2a13 100644
--- a/frontend/src/lib/components/CronInput.svelte
+++ b/frontend/src/lib/components/CronInput.svelte
@@ -5,9 +5,12 @@
// @ts-ignore
import Multiselect from 'svelte-multiselect'
- import TimezonePicker from 'svelte-timezone-picker'
import CollapseLink from './CollapseLink.svelte'
import { Button } from './common'
+ import Select from '../components/apps/svelte-select/lib/index'
+ import timezones from './timezones'
+ import { SELECT_INPUT_DEFAULT_STYLE } from '$lib/defaults'
+ import { onMount } from 'svelte'
export let schedule: string
// export let offset: number = -60 * Math.floor(new Date().getTimezoneOffset() / 60)
@@ -142,6 +145,34 @@
timeZone: timezone,
timeZoneName: 'short'
}).format
+
+ let darkMode: boolean = false
+
+ function onThemeChange() {
+ if (document.documentElement.classList.contains('dark')) {
+ darkMode = true
+ } else {
+ darkMode = false
+ }
+ }
+
+ onMount(() => {
+ onThemeChange()
+ })
+
+ const items = Object.keys(timezones)
+ .map((key) => {
+ return Object.keys(timezones[key])
+ .map((subKey) => {
+ return {
+ value: subKey,
+ label: subKey,
+ group: timezones[key][subKey][1]
+ }
+ })
+ .flat()
+ })
+ .flat()
@@ -170,7 +201,19 @@
{timezone}
{:else}
- (timezone = e.detail.timezone)} />
+