From 42ca629adc5fa6258539201848838043386edf3a Mon Sep 17 00:00:00 2001 From: Yunus M Date: Mon, 20 Apr 2026 14:46:10 +0530 Subject: [PATCH] refactor: remove unused SVG and test files, update styles and structure in Integrations components --- frontend/public/svgs/dotted-double-line.svg | 312 ------------------ .../__tests__/RequestIntegration.test.tsx | 62 ---- .../IntegrationsHeader.styles.scss | 5 + .../IntegrationsHeader/IntegrationsHeader.tsx | 1 + .../IntegrationsList.styles.scss | 21 +- .../IntegrationsList/IntegrationsList.tsx | 7 +- 6 files changed, 21 insertions(+), 387 deletions(-) delete mode 100644 frontend/public/svgs/dotted-double-line.svg delete mode 100644 frontend/src/container/Integrations/CloudIntegration/__tests__/RequestIntegration.test.tsx diff --git a/frontend/public/svgs/dotted-double-line.svg b/frontend/public/svgs/dotted-double-line.svg deleted file mode 100644 index 7950fa118a..0000000000 --- a/frontend/public/svgs/dotted-double-line.svg +++ /dev/null @@ -1,312 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/frontend/src/container/Integrations/CloudIntegration/__tests__/RequestIntegration.test.tsx b/frontend/src/container/Integrations/CloudIntegration/__tests__/RequestIntegration.test.tsx deleted file mode 100644 index 5b91b45a20..0000000000 --- a/frontend/src/container/Integrations/CloudIntegration/__tests__/RequestIntegration.test.tsx +++ /dev/null @@ -1,62 +0,0 @@ -import { I18nextProvider } from 'react-i18next'; -import { act, fireEvent, render, screen } from '@testing-library/react'; -import { RequestIntegrationBtn } from 'container/Integrations/RequestIntegrationBtn'; -import { IntegrationType } from 'container/Integrations/types'; -import { server } from 'mocks-server/server'; -import { rest } from 'msw'; -import i18n from 'ReactI18'; - -describe.skip('Request AWS integration', () => { - it('should render the request integration button', async () => { - let capturedPayload: any; - server.use( - rest.post('http://localhost/api/v1/event', async (req, res, ctx) => { - capturedPayload = await req.json(); - return res( - ctx.status(200), - ctx.json({ - statusCode: 200, - error: null, - payload: 'Event Processed Successfully', - }), - ); - }), - ); - act(() => { - render( - - {' '} - , - ); - }); - - expect( - screen.getByText( - /can't find what you’re looking for\? request more integrations/i, - ), - ).toBeInTheDocument(); - - await act(() => { - fireEvent.change(screen.getByPlaceholderText(/Enter integration name/i), { - target: { value: 's3 sync' }, - }); - - const submitButton = screen.getByRole('button', { name: /submit/i }); - - expect(submitButton).toBeEnabled(); - - fireEvent.click(submitButton); - }); - - expect(capturedPayload.eventName).toBeDefined(); - expect(capturedPayload.attributes).toBeDefined(); - - expect(capturedPayload.eventName).toBe('AWS service integration requested'); - expect(capturedPayload.attributes).toEqual({ - screen: 'AWS integration details', - integration: 's3 sync', - deployment_url: 'localhost', - user_email: null, - }); - }); -}); diff --git a/frontend/src/container/Integrations/IntegrationsHeader/IntegrationsHeader.styles.scss b/frontend/src/container/Integrations/IntegrationsHeader/IntegrationsHeader.styles.scss index 65dee40d91..42d5e88645 100644 --- a/frontend/src/container/Integrations/IntegrationsHeader/IntegrationsHeader.styles.scss +++ b/frontend/src/container/Integrations/IntegrationsHeader/IntegrationsHeader.styles.scss @@ -50,6 +50,11 @@ display: flex; flex-direction: column; gap: 16px; + + .request-integration-input { + width: 100%; + color: var(--l1-foreground); + } } .request-integration-form-title { diff --git a/frontend/src/container/Integrations/IntegrationsHeader/IntegrationsHeader.tsx b/frontend/src/container/Integrations/IntegrationsHeader/IntegrationsHeader.tsx index 7a7ff2e871..cb834be875 100644 --- a/frontend/src/container/Integrations/IntegrationsHeader/IntegrationsHeader.tsx +++ b/frontend/src/container/Integrations/IntegrationsHeader/IntegrationsHeader.tsx @@ -113,6 +113,7 @@ function IntegrationsHeader(props: IntegrationsHeaderProps): JSX.Element { Which integration are you looking for? { diff --git a/frontend/src/container/Integrations/IntegrationsList/IntegrationsList.styles.scss b/frontend/src/container/Integrations/IntegrationsList/IntegrationsList.styles.scss index 71a81d0185..883a7385f9 100644 --- a/frontend/src/container/Integrations/IntegrationsList/IntegrationsList.styles.scss +++ b/frontend/src/container/Integrations/IntegrationsList/IntegrationsList.styles.scss @@ -132,7 +132,6 @@ flex-direction: row; gap: 10px; padding: 8px 16px; - border-radius: 3px; color: var(--l1-foreground); cursor: pointer; @@ -142,23 +141,25 @@ flex-direction: row; gap: 10px; align-items: center; + padding: 4px; + + border: 1px solid var(--l3-border); + background: var(--l3-background); + border-radius: 2px; .integrations-list-item-name-image-container-image { - height: 16px; - width: 16px; - border-radius: 2px; - border: 1px solid var(--l3-border); - background: var(--l2-background); + height: 12px; + width: 12px; } } - &:hover { - background: var(--l1-background); - } - &:nth-child(even) { background: var(--l2-background); } + + &:hover { + background: var(--l3-background-hover); + } } .integrations-list-item-column { diff --git a/frontend/src/container/Integrations/IntegrationsList/IntegrationsList.tsx b/frontend/src/container/Integrations/IntegrationsList/IntegrationsList.tsx index 838a56f0dd..af5b592359 100644 --- a/frontend/src/container/Integrations/IntegrationsList/IntegrationsList.tsx +++ b/frontend/src/container/Integrations/IntegrationsList/IntegrationsList.tsx @@ -152,9 +152,10 @@ function IntegrationsList(props: IntegrationsListProps): JSX.Element { alt={integration.title} className="integrations-list-item-name-image-container-image" /> -
- {integration.title} -
+ + +
+ {integration.title}