Skip to content

Commit 0e1fc65

Browse files
fix: merge conflicts
2 parents a20e009 + f9cbdd7 commit 0e1fc65

22 files changed

+601
-253
lines changed

ui/src/modules/common/Modals/DestinationDatabaseModal.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { useState, useEffect } from "react"
2-
import { Modal, Radio, Input, Button } from "antd"
2+
import { Modal, Radio, Input, Button, message } from "antd"
33
import { useAppStore } from "../../../store"
44
import { validateAlphanumericUnderscore } from "../../../utils/utils"
55
import {
@@ -55,6 +55,12 @@ const DestinationDatabaseModal = ({
5555
)
5656

5757
const handleSaveChanges = () => {
58+
if (databaseName.trim() === "") {
59+
message.error(
60+
`${selectedFormat === FORMAT_OPTIONS.DYNAMIC ? `${labels.title} Prefix` : `${labels.title}`} can not be empty`,
61+
)
62+
return
63+
}
5864
onSave(selectedFormat, databaseName)
5965
setShowDestinationDatabaseModal(false)
6066
}
Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
import { FC } from "react"
2+
import { WarningIcon } from "@phosphor-icons/react"
3+
import { Button, Modal } from "antd"
4+
5+
import { useAppStore } from "../../../store"
6+
import { ResetStreamsModalProps } from "../../../types"
7+
8+
const ResetStreamsModal: FC<ResetStreamsModalProps> = ({ onConfirm }) => {
9+
const { showResetStreamsModal, setShowResetStreamsModal } = useAppStore()
10+
11+
const handleCancel = () => setShowResetStreamsModal(false)
12+
13+
const handleConfirm = () => {
14+
setShowResetStreamsModal(false)
15+
onConfirm()
16+
}
17+
18+
return (
19+
<Modal
20+
open={showResetStreamsModal}
21+
onCancel={handleCancel}
22+
footer={null}
23+
closable={false}
24+
centered
25+
title={
26+
<div className="flex items-center gap-2 text-danger">
27+
<WarningIcon
28+
className="size-9"
29+
weight="fill"
30+
/>
31+
</div>
32+
}
33+
>
34+
<div className="flex flex-col items-center gap-6">
35+
<div className="flex w-full flex-col">
36+
<p className="text-xl font-medium text-slate-700">
37+
Your changes will not be saved
38+
</p>
39+
<p className="text-sm text-slate-700">
40+
Leaving this page will loose all your progress & changes.
41+
</p>
42+
<p className="mt-6">Are you sure you want to leave?</p>
43+
</div>
44+
45+
<div className="flex w-full justify-end gap-3">
46+
<Button
47+
type="primary"
48+
className="!bg-[#f5222d]"
49+
onClick={handleConfirm}
50+
>
51+
Yes, Leave
52+
</Button>
53+
<Button onClick={handleCancel}>No</Button>
54+
</div>
55+
</div>
56+
</Modal>
57+
)
58+
}
59+
60+
export default ResetStreamsModal

ui/src/modules/destinations/pages/CreateDestination.tsx

Lines changed: 47 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,13 @@ import {
77
} from "react"
88
import { Link, useNavigate } from "react-router-dom"
99
import { Input, message, Select, Spin } from "antd"
10-
import { ArrowLeft, ArrowRight, Info, Notebook } from "@phosphor-icons/react"
10+
import {
11+
ArrowLeftIcon,
12+
ArrowRightIcon,
13+
ArrowSquareOutIcon,
14+
InfoIcon,
15+
NotebookIcon,
16+
} from "@phosphor-icons/react"
1117
import Form from "@rjsf/antd"
1218

1319
import { useAppStore } from "../../../store"
@@ -27,6 +33,7 @@ import {
2733
import {
2834
CONNECTOR_TYPES,
2935
DESTINATION_INTERNAL_TYPES,
36+
OLAKE_LATEST_VERSION_URL,
3037
SETUP_TYPES,
3138
TEST_CONNECTION_STATUS,
3239
transformErrors,
@@ -102,6 +109,9 @@ const CreateDestination = forwardRef<
102109
const [schema, setSchema] = useState<any>(null)
103110
const [loading, setLoading] = useState(false)
104111
const [uiSchema, setUiSchema] = useState<any>(null)
112+
const [existingDestination, setExistingDestination] = useState<
113+
string | null
114+
>(null)
105115
const [filteredDestinations, setFilteredDestinations] = useState<
106116
ExtendedDestination[]
107117
>([])
@@ -403,16 +413,27 @@ const CreateDestination = forwardRef<
403413
}
404414

405415
const handleConnectorChange = (value: string) => {
406-
setFormData({})
407-
setSchema(null)
408416
setConnector(value as ConnectorType)
409-
if (onConnectorChange) {
410-
onConnectorChange(value)
417+
if (setupType === SETUP_TYPES.EXISTING) {
418+
setExistingDestination(null)
419+
setDestinationName("")
420+
onDestinationNameChange?.("")
411421
}
422+
setVersion("")
423+
setFormData({})
424+
setSchema(null)
425+
426+
// Parent callbacks
427+
onConnectorChange?.(value)
428+
onVersionChange?.("")
429+
onFormDataChange?.({})
412430
}
413431

414432
const handleSetupTypeChange = (type: SetupType) => {
415433
setSetupType(type)
434+
setDestinationName("")
435+
onDestinationNameChange?.("")
436+
416437
if (onDocsMinimizedChange) {
417438
if (type === SETUP_TYPES.EXISTING) {
418439
onDocsMinimizedChange(true)
@@ -422,12 +443,11 @@ const CreateDestination = forwardRef<
422443
}
423444
// Clear form data when switching to new destination
424445
if (type === SETUP_TYPES.NEW) {
425-
setDestinationName("")
426446
setFormData({})
427447
setSchema(null)
428448
setConnector(CONNECTOR_TYPES.DESTINATION_DEFAULT_CONNECTOR) // Reset to default connector
449+
setExistingDestination(null)
429450
// Schema will be automatically fetched due to useEffect when connector changes
430-
if (onDestinationNameChange) onDestinationNameChange("")
431451
if (onConnectorChange) onConnectorChange(CONNECTOR_TYPES.AMAZON_S3)
432452
if (onFormDataChange) onFormDataChange({})
433453
if (onVersionChange) onVersionChange("")
@@ -454,6 +474,7 @@ const CreateDestination = forwardRef<
454474
if (onFormDataChange) onFormDataChange(configObj)
455475
setDestinationName(selectedDestination.name)
456476
setFormData(configObj)
477+
setExistingDestination(value)
457478
}
458479

459480
const handleVersionChange = (value: string) => {
@@ -488,7 +509,20 @@ const CreateDestination = forwardRef<
488509
</FormField>
489510
</div>
490511
<div className="w-1/2">
491-
<FormField label="Version:">
512+
<FormField
513+
label="OLake Version:"
514+
tooltip="Choose the OLake version for the destination"
515+
info={
516+
<a
517+
href={OLAKE_LATEST_VERSION_URL}
518+
target="_blank"
519+
rel="noopener noreferrer"
520+
className="flex items-center text-primary hover:text-primary/80"
521+
>
522+
<ArrowSquareOutIcon className="size-4" />
523+
</a>
524+
}
525+
>
492526
{loadingVersions ? (
493527
<div className="flex h-8 items-center justify-center">
494528
<Spin size="small" />
@@ -506,7 +540,7 @@ const CreateDestination = forwardRef<
506540
/>
507541
) : (
508542
<div className="flex items-center gap-1 text-sm text-red-500">
509-
<Info />
543+
<InfoIcon />
510544
No versions available
511545
</div>
512546
)}
@@ -551,7 +585,7 @@ const CreateDestination = forwardRef<
551585
placeholder="Select a destination"
552586
className="w-full"
553587
onChange={handleExistingDestinationSelect}
554-
value={undefined}
588+
value={existingDestination}
555589
options={filteredDestinations.map(d => ({
556590
value: d.id,
557591
label: d.name,
@@ -623,7 +657,7 @@ const CreateDestination = forwardRef<
623657
to={"/destinations"}
624658
className="flex items-center gap-2 p-1.5 hover:rounded-md hover:bg-gray-100 hover:text-black"
625659
>
626-
<ArrowLeft className="mr-1 size-5" />
660+
<ArrowLeftIcon className="mr-1 size-5" />
627661
</Link>
628662
<div className="text-lg font-bold">Create destination</div>
629663
</div>
@@ -641,7 +675,7 @@ const CreateDestination = forwardRef<
641675
<div className="mb-6 mt-2 rounded-xl border border-gray-200 bg-white p-6 shadow-sm">
642676
<div>
643677
<div className="mb-4 flex items-center gap-2 text-base font-medium">
644-
<Notebook className="size-5" />
678+
<NotebookIcon className="size-5" />
645679
Capture information
646680
</div>
647681

@@ -671,7 +705,7 @@ const CreateDestination = forwardRef<
671705
}}
672706
>
673707
Create
674-
<ArrowRight className="size-4 text-white" />
708+
<ArrowRightIcon className="size-4 text-white" />
675709
</button>
676710
</div>
677711
)}

ui/src/modules/destinations/pages/DestinationEdit.tsx

Lines changed: 55 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,24 @@
11
import React, { useState, useEffect, useRef } from "react"
22
import { useParams, Link, useNavigate } from "react-router-dom"
33
import { formatDistanceToNow } from "date-fns"
4-
import { Input, Button, Select, Switch, message, Spin, Table } from "antd"
4+
import {
5+
Input,
6+
Button,
7+
Select,
8+
Switch,
9+
message,
10+
Spin,
11+
Table,
12+
Tooltip,
13+
} from "antd"
514
import type { ColumnsType } from "antd/es/table"
6-
import { ArrowLeft, Info, Notebook, PencilSimple } from "@phosphor-icons/react"
15+
import {
16+
ArrowLeft,
17+
ArrowSquareOut,
18+
Info,
19+
Notebook,
20+
PencilSimple,
21+
} from "@phosphor-icons/react"
722
import validator from "@rjsf/validator-ajv8"
823
import Form from "@rjsf/antd"
924

@@ -31,6 +46,7 @@ import {
3146
TAB_TYPES,
3247
ENTITY_TYPES,
3348
DISPLAYED_JOBS_COUNT,
49+
OLAKE_LATEST_VERSION_URL,
3450
transformErrors,
3551
TEST_CONNECTION_STATUS,
3652
} from "../../../utils/constants"
@@ -137,6 +153,8 @@ const DestinationEdit: React.FC<DestinationEditProps> = ({
137153
? JSON.parse(destination.config)
138154
: destination.config
139155
setFormData(config)
156+
} else {
157+
navigate("/destinations")
140158
}
141159
}
142160
}, [destinationId, destinations, fetchDestinations])
@@ -488,13 +506,27 @@ const DestinationEdit: React.FC<DestinationEditProps> = ({
488506
onChange={updateConnector}
489507
className="h-8 w-full"
490508
options={connectorOptions}
491-
disabled={fromJobFlow}
509+
disabled
492510
/>
493511
</div>
494512
</div>
495513
<div className="w-1/2">
496-
<label className="mb-2 block text-sm font-medium text-gray-700">
497-
Version:
514+
<label className="mb-2 flex items-center gap-1 text-sm font-medium text-gray-700">
515+
OLake Version:
516+
<Tooltip title="Choose the OLake version for the destination">
517+
<Info
518+
size={16}
519+
className="cursor-help text-slate-900"
520+
/>
521+
</Tooltip>
522+
<a
523+
href={OLAKE_LATEST_VERSION_URL}
524+
target="_blank"
525+
rel="noopener noreferrer"
526+
className="flex items-center text-primary hover:text-primary/80"
527+
>
528+
<ArrowSquareOut className="size-4" />
529+
</a>
498530
</label>
499531
{loadingVersions ? (
500532
<div className="flex h-8 items-center justify-center">
@@ -532,7 +564,7 @@ const DestinationEdit: React.FC<DestinationEditProps> = ({
532564
value={destinationName}
533565
onChange={e => updateDestinationName(e.target.value)}
534566
className="h-8"
535-
disabled={fromJobFlow}
567+
disabled
536568
/>
537569
</div>
538570
</div>
@@ -686,32 +718,31 @@ const DestinationEdit: React.FC<DestinationEditProps> = ({
686718
? renderConfigTab()
687719
: renderJobsTab()}
688720
</div>
689-
690721
{/* Footer */}
691722
{!fromJobFlow && (
692723
<div className="flex justify-between border-t border-gray-200 bg-white p-4 shadow-sm">
693724
<div>
694-
{
695-
<button
696-
className="ml-1 rounded-md border border-danger px-4 py-2 text-danger transition-colors duration-200 hover:bg-danger hover:text-white"
697-
onClick={handleDelete}
698-
>
699-
Delete
700-
</button>
701-
}
702-
</div>
703-
<div className="flex space-x-4">
704725
<button
705-
className="mr-1 flex items-center justify-center gap-1 rounded-md bg-primary px-4 py-2 font-light text-white shadow-sm transition-colors duration-200 hover:bg-primary-600"
706-
onClick={() => {
707-
if (formRef.current) {
708-
formRef.current.submit()
709-
}
710-
}}
726+
className="ml-1 rounded-md border border-danger px-4 py-2 text-danger transition-colors duration-200 hover:bg-danger hover:text-white"
727+
onClick={handleDelete}
711728
>
712-
Save Changes
729+
Delete
713730
</button>
714731
</div>
732+
<div className="flex space-x-4">
733+
{activeTab === TAB_TYPES.CONFIG && (
734+
<button
735+
className="mr-1 flex items-center justify-center gap-1 rounded-md bg-primary px-4 py-2 font-light text-white shadow-sm transition-colors duration-200"
736+
onClick={() => {
737+
if (formRef.current) {
738+
formRef.current.submit()
739+
}
740+
}}
741+
>
742+
Save changes
743+
</button>
744+
)}
745+
</div>
715746
</div>
716747
)}
717748
</div>

0 commit comments

Comments
 (0)