mirror of
https://github.com/SigNoz/signoz.git
synced 2025-12-29 16:14:42 +00:00
* feat: aws Integration skeleton UI (#6758) * feat: add AWS integration in the integrations list and redirect to the new Cloud Integration page * feat: cloud integration details page header (i.e. breadcrumb and get help button) UI * feat: hero section UI * refactor: extract Header and HeroSection components from CloudIntegrationPage * feat: services tab bar and sidebar UI * feat: cloud integration details services UI * refactor: group and extract cloud integration components to files * fix: set default active service to the first service in the list if no service is specified * feat: add NEW flag for AWS integration in the integrations list page * chore: overall improvements * chore: move cloud integration pages to /container * fix: hero section background * feat: aws Integration: Account setup basic UI and functionality (#6806) * feat: implement basic cloud account management UI in HeroSection * feat: aws Integration: Integrate now modal (#6807) * feat: implement basic cloud account management UI in HeroSection * feat: start working on integrate now modal UI * feat: integrate now modal UI * feat: integrate now modal states and json server API integration * feat: get accounts from json-server API, and redirect Add new account to the integrations modal * feat: display error state if last_heartbeat_ts_ms is null even after 5 minutes * chore: update import path for regions data in useRegionSelection hook * chore: move hero section components inside the HeroSection/components * feat: create a reusable modal component * refactor: make the cloud account setup modal readable / DRYer * feat: aws Integration: Account settings modal (#6808) * feat: implement basic cloud account management UI in HeroSection * feat: start working on integrate now modal UI * feat: get accounts from json-server API, and redirect Add new account to the integrations modal * feat: integrate now modal UI * feat: integrate now modal states and json server API integration * feat: account settings * feat: service status UI * refactor: make account settings modal more readable and overall improvements * feat: Get data from json server api data in service sections (#6809) * feat: implement basic cloud account management UI in HeroSection * feat: start working on integrate now modal UI * feat: get accounts from json-server API, and redirect Add new account to the integrations modal * refactor: make the cloud account setup modal readable / DRYer * feat: integrate now modal states and json server API integration * refactor: make account settings modal more readable and overall improvements * feat: integrate now modal states and json server API integration * feat: display error state if last_heartbeat_ts_ms is null even after 5 minutes * feat: get the services list and details from json server API response * feat: update account actions to set accountId in URL query on initial account load * feat: configure service modal (#6814) * feat: implement basic cloud account management UI in HeroSection * feat: start working on integrate now modal UI * feat: get accounts from json-server API, and redirect Add new account to the integrations modal * refactor: make the cloud account setup modal readable / DRYer * feat: integrate now modal states and json server API integration * feat: get accounts from json-server API, and redirect Add new account to the integrations modal * feat: integrate now modal states and json server API integration * feat: get accounts from json-server API, and redirect Add new account to the integrations modal * feat: display error state if last_heartbeat_ts_ms is null even after 5 minutes * feat: account settings * feat: service status UI * feat: get the services list and details from json server API response * feat: update account actions to set accountId in URL query on initial account load * feat: configure service modal UI * feat: configure service modal functionality and API changes * feat: replace loading indicators with Spinner component in ServiceDetails and ServicesList * fix: make the configure service modal work * feat: light mode support and overall improvements to AWS integration page (#6817) * refactor: make the cloud account setup modal readable / DRYer * feat: integrate now modal states and json server API integration * refactor: make account settings modal more readable and overall improvements * fix: integrate now modal button improvements * feat: aws integrations light mode * refactor: overall improvements * refactor: define react query keys in constant * feat: services filter * feat: render service overview as markdown * feat: integrate AWS integration page API (#6851) * feat: replace json-server APIs with actual APIs * fix: add null checks and fix the issues * chore: remove the console.log * feat: temporarily hide AWS Integration from integrations list * chore: add optimized png * refactor: extract service filter types into an enum * chore: remove console.log * chore: remove duplicate files * refactor: move regions to utils * fix: get account id from url param * chore: address PR review comments * refactor: use the IntegrateNowFormSections inside RegionForm * chore: move integrations select inline style to a common class --------- Co-authored-by: Shaheer Kochai <ashaheerki@gmail.com>
140 lines
3.6 KiB
TypeScript
140 lines
3.6 KiB
TypeScript
import { Form } from 'antd';
|
|
import { FormInstance } from 'antd/lib';
|
|
import { CloudAccount } from 'container/CloudIntegrationPage/ServicesSection/types';
|
|
import { useUpdateAccountConfig } from 'hooks/integrations/aws/useUpdateAccountConfig';
|
|
import { isEqual } from 'lodash-es';
|
|
import {
|
|
Dispatch,
|
|
SetStateAction,
|
|
useCallback,
|
|
useEffect,
|
|
useMemo,
|
|
useState,
|
|
} from 'react';
|
|
import { AccountConfigPayload } from 'types/api/integrations/aws';
|
|
import { regions } from 'utils/regions';
|
|
|
|
interface UseAccountSettingsModalProps {
|
|
onClose: () => void;
|
|
account: CloudAccount;
|
|
setActiveAccount: Dispatch<SetStateAction<CloudAccount | null>>;
|
|
}
|
|
|
|
interface UseAccountSettingsModal {
|
|
form: FormInstance;
|
|
isLoading: boolean;
|
|
selectedRegions: string[];
|
|
includeAllRegions: boolean;
|
|
isRegionSelectOpen: boolean;
|
|
isSaveDisabled: boolean;
|
|
setSelectedRegions: Dispatch<SetStateAction<string[]>>;
|
|
setIncludeAllRegions: Dispatch<SetStateAction<boolean>>;
|
|
setIsRegionSelectOpen: Dispatch<SetStateAction<boolean>>;
|
|
handleIncludeAllRegionsChange: (checked: boolean) => void;
|
|
handleSubmit: () => Promise<void>;
|
|
handleClose: () => void;
|
|
}
|
|
|
|
const allRegions = (): string[] =>
|
|
regions.flatMap((r) => r.subRegions.map((sr) => sr.name));
|
|
|
|
const getRegionPreviewText = (regions: string[] | undefined): string[] => {
|
|
if (!regions) return [];
|
|
if (regions.includes('all')) {
|
|
return allRegions();
|
|
}
|
|
return regions;
|
|
};
|
|
|
|
export function useAccountSettingsModal({
|
|
onClose,
|
|
account,
|
|
setActiveAccount,
|
|
}: UseAccountSettingsModalProps): UseAccountSettingsModal {
|
|
const [form] = Form.useForm();
|
|
const { mutate: updateConfig, isLoading } = useUpdateAccountConfig();
|
|
const accountRegions = useMemo(() => account?.config?.regions || [], [
|
|
account?.config?.regions,
|
|
]);
|
|
const [isInitialRegionsSet, setIsInitialRegionsSet] = useState(false);
|
|
|
|
const [selectedRegions, setSelectedRegions] = useState<string[]>([]);
|
|
const [includeAllRegions, setIncludeAllRegions] = useState(false);
|
|
const [isRegionSelectOpen, setIsRegionSelectOpen] = useState(false);
|
|
|
|
// Initialize regions from account when modal opens
|
|
useEffect(() => {
|
|
if (accountRegions.length > 0 && !isInitialRegionsSet) {
|
|
setSelectedRegions(accountRegions);
|
|
setIsInitialRegionsSet(true);
|
|
setIncludeAllRegions(accountRegions.includes('all'));
|
|
}
|
|
}, [accountRegions, isInitialRegionsSet]);
|
|
|
|
const handleSubmit = useCallback(async (): Promise<void> => {
|
|
try {
|
|
await form.validateFields();
|
|
const payload: AccountConfigPayload = {
|
|
config: {
|
|
regions: selectedRegions,
|
|
},
|
|
};
|
|
|
|
updateConfig(
|
|
{ accountId: account?.id, payload },
|
|
{
|
|
onSuccess: (response) => {
|
|
setActiveAccount(response.data);
|
|
onClose();
|
|
},
|
|
},
|
|
);
|
|
} catch (error) {
|
|
console.error('Form submission failed:', error);
|
|
}
|
|
}, [
|
|
form,
|
|
selectedRegions,
|
|
updateConfig,
|
|
account?.id,
|
|
setActiveAccount,
|
|
onClose,
|
|
]);
|
|
|
|
const isSaveDisabled = useMemo(
|
|
() => isEqual(selectedRegions.sort(), accountRegions.sort()),
|
|
[selectedRegions, accountRegions],
|
|
);
|
|
|
|
const handleIncludeAllRegionsChange = useCallback((checked: boolean): void => {
|
|
setIncludeAllRegions(checked);
|
|
if (checked) {
|
|
setSelectedRegions(['all']);
|
|
} else {
|
|
setSelectedRegions([]);
|
|
}
|
|
}, []);
|
|
|
|
const handleClose = useCallback(() => {
|
|
setIsRegionSelectOpen(false);
|
|
onClose();
|
|
}, [onClose]);
|
|
|
|
return {
|
|
form,
|
|
isLoading,
|
|
selectedRegions,
|
|
includeAllRegions,
|
|
isRegionSelectOpen,
|
|
isSaveDisabled,
|
|
setSelectedRegions,
|
|
setIncludeAllRegions,
|
|
setIsRegionSelectOpen,
|
|
handleIncludeAllRegionsChange,
|
|
handleSubmit,
|
|
handleClose,
|
|
};
|
|
}
|
|
|
|
export { getRegionPreviewText };
|