docs: add servers block to the openapi spec (#11129)

* docs: add servers block to the openapi spec

* docs: add info block

docs/api/openapi.yml

@@ -5296,7 +5296,12 @@ components:
       scheme: bearer
       type: http
 info:
+  contact:
+    email: support@signoz.io
+    name: SigNoz Support
+    url: https://signoz.io
   description: OpenTelemetry-Native Logs, Metrics and Traces in a single pane
+  termsOfService: https://signoz.io/terms-of-service/
   title: SigNoz
   version: ""
 openapi: 3.0.3
@@ -17512,3 +17517,16 @@ paths:
       summary: Replace variables
       tags:
       - querier
+servers:
+- description: The fully qualified URL to the SigNoz APIServer.
+  url: https://{host}:{port}{base_path}
+  variables:
+    base_path:
+      default: /
+      description: The base path of the SigNoz APIServer
+    host:
+      default: localhost
+      description: The host of the SigNoz APIServer
+    port:
+      default: "8080"
+      description: The port of the SigNoz APIServer

frontend/src/AppRoutes/__tests__/Private.test.tsx

@@ -105,7 +105,7 @@ function createMockLicense(
 			status: '',
 			updated_at: '0',
 		},
-		state: LicenseState.ACTIVE,
+		state: LicenseState.ACTIVATED,
 		status: LicenseStatus.VALID,
 		platform: LicensePlatform.CLOUD,
 		created_at: '0',
@@ -931,7 +931,7 @@ describe('PrivateRoute', () => {
 					isFetchingActiveLicense: false,
 					activeLicense: createMockLicense({
 						platform: LicensePlatform.CLOUD,
-						state: LicenseState.ACTIVE,
+						state: LicenseState.ACTIVATED,
 					}),
 				},
 				isCloudUser: true,
@@ -1522,7 +1522,7 @@ describe('PrivateRoute', () => {
 					isFetchingActiveLicense: false,
 					activeLicense: createMockLicense({
 						platform: LicensePlatform.CLOUD,
-						state: LicenseState.ACTIVE,
+						state: LicenseState.ACTIVATED,
 					}),
 					trialInfo: createMockTrialInfo({ workSpaceBlock: false }),
 					user: createMockUser({ role: USER_ROLES.ADMIN as ROLES }),

frontend/src/container/BillingContainer/BillingContainer.test.tsx

@@ -4,7 +4,13 @@ import {
 	notOfTrailResponse,
 	trialConvertedToSubscriptionResponse,
 } from 'mocks-server/__mockdata__/licenses';
-import { act, render, screen } from 'tests/test-utils';
+import { act, render, screen, getAppContextMock } from 'tests/test-utils';
+import APIError from 'types/api/error';
+import {
+	LicensePlatform,
+	LicenseResModel,
+	LicenseState,
+} from 'types/api/licensesV3/getActive';
 import { getFormattedDate } from 'utils/timeUtils';
 
 import BillingContainer from './BillingContainer';
@@ -99,6 +105,10 @@ describe('BillingContainer', () => {
 			await expect(
 				screen.findByRole('link', { name: /here/i }),
 			).resolves.toBeInTheDocument();
+
+			await expect(
+				screen.findByText('Cancel Subscription', { selector: 'span' }),
+			).resolves.toBeInTheDocument();
 		});
 
 		it('OnTrail but trialConvertedToSubscription', async () => {
@@ -138,6 +148,85 @@ describe('BillingContainer', () => {
 			const dayRemainingInBillingPeriod =
 				await screen.findByText(/1 days_remaining/i);
 			expect(dayRemainingInBillingPeriod).toBeInTheDocument();
+
+			await expect(
+				screen.findByText('Cancel Subscription', { selector: 'span' }),
+			).resolves.toBeInTheDocument();
+		});
+	});
+
+	describe('CancelSubscriptionBanner visibility', () => {
+		const baseActiveLicense = getAppContextMock('ADMIN')
+			.activeLicense as LicenseResModel;
+
+		it('should render when license is ACTIVATED and platform is CLOUD', async () => {
+			render(<BillingContainer />);
+			await expect(
+				screen.findByText('Cancel Subscription', { selector: 'span' }),
+			).resolves.toBeInTheDocument();
+		});
+
+		it.each([
+			['EXPIRED', LicenseState.EXPIRED],
+			['TERMINATED', LicenseState.TERMINATED],
+			['CANCELLED', LicenseState.CANCELLED],
+			['EVALUATION_EXPIRED', LicenseState.EVALUATION_EXPIRED],
+			['DEFAULTED', LicenseState.DEFAULTED],
+			['ISSUED', LicenseState.ISSUED],
+			['EVALUATING', LicenseState.EVALUATING],
+		])('should not render when license state is %s', async (_, state) => {
+			render(
+				<BillingContainer />,
+				{},
+				{
+					appContextOverrides: {
+						activeLicense: { ...baseActiveLicense, state },
+					},
+				},
+			);
+			await screen.findByText('billing');
+			expect(
+				screen.queryByText('Cancel Subscription', { selector: 'span' }),
+			).not.toBeInTheDocument();
+		});
+
+		const makeAPIError = (statusCode: number): APIError =>
+			new APIError({
+				httpStatusCode: statusCode as any,
+				error: { code: 'error', message: 'error', url: '', errors: [] },
+			});
+
+		it.each([
+			[
+				'Self-Hosted platform',
+				{
+					activeLicense: {
+						...baseActiveLicense,
+						platform: LicensePlatform.SELF_HOSTED,
+					},
+					activeLicenseFetchError: null,
+				},
+			],
+			[
+				'Community Enterprise user (license API 404)',
+				{
+					activeLicense: null,
+					activeLicenseFetchError: makeAPIError(404),
+				},
+			],
+			[
+				'Community user (license API 501)',
+				{
+					activeLicense: null,
+					activeLicenseFetchError: makeAPIError(501),
+				},
+			],
+		])('should not render for %s', async (_, overrides) => {
+			render(<BillingContainer />, {}, { appContextOverrides: overrides });
+			await screen.findByText('billing');
+			expect(
+				screen.queryByText('Cancel Subscription', { selector: 'span' }),
+			).not.toBeInTheDocument();
 		});
 	});
 

frontend/src/container/BillingContainer/BillingContainer.tsx

@@ -34,10 +34,12 @@ import { CheckoutSuccessPayloadProps } from 'types/api/billing/checkout';
 import { getBaseUrl } from 'utils/basePath';
 import { getFormattedDate, getRemainingDays } from 'utils/timeUtils';
 
+import CancelSubscriptionBanner from './CancelSubscriptionBanner';
 import { BillingUsageGraph } from './BillingUsageGraph/BillingUsageGraph';
 import { prepareCsvData } from './BillingUsageGraph/utils';
 
 import './BillingContainer.styles.scss';
+import { LicenseState } from 'types/api/licensesV3/getActive';
 
 interface DataType {
 	key: string;
@@ -317,7 +319,7 @@ export default function BillingContainer(): JSX.Element {
 
 	const handleBilling = useCallback(async () => {
 		if (!trialInfo?.trialConvertedToSubscription) {
-			logEvent('Billing : Upgrade Plan', {
+			void logEvent('Billing : Upgrade Plan', {
 				user: pick(user, ['email', 'userId', 'name']),
 				org,
 			});
@@ -326,7 +328,7 @@ export default function BillingContainer(): JSX.Element {
 				url: getBaseUrl(),
 			});
 		} else {
-			logEvent('Billing : Manage Billing', {
+			void logEvent('Billing : Manage Billing', {
 				user: pick(user, ['email', 'userId', 'name']),
 				org,
 			});
@@ -535,6 +537,10 @@ export default function BillingContainer(): JSX.Element {
 				{(isLoading || isFetchingBillingData) && renderTableSkeleton()}
 			</div>
 
+			{isCloudUserVal && activeLicense?.state === LicenseState.ACTIVATED && (
+				<CancelSubscriptionBanner />
+			)}
+
 			{!trialInfo?.trialConvertedToSubscription && (
 				<div className="upgrade-plan-benefits">
 					<Row

frontend/src/container/BillingContainer/CancelSubscriptionBanner.module.scss

@@ -0,0 +1,35 @@
+.banner {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	padding: var(--padding-4);
+	border-radius: 4px;
+	border: 1px solid var(--callout-error-border);
+	background-color: var(--callout-error-background);
+	margin: var(--spacing-4) 0 var(--spacing-12);
+}
+
+.info {
+	display: flex;
+	flex-direction: column;
+	gap: var(--spacing-2);
+}
+
+.title {
+	font-size: var(--font-size-sm);
+	font-weight: var(--font-weight-medium);
+	color: var(--callout-error-title);
+}
+
+.subtitle {
+	font-size: var(--paragraph-base-400-font-size);
+	font-weight: var(--paragraph-base-400-font-weight);
+	line-height: var(--paragraph-base-400-line-height);
+	color: var(--callout-error-icon);
+}
+
+.dialogBody {
+	font-size: var(--font-size-sm);
+	line-height: var(--line-height-relaxed);
+	color: var(--l2-foreground);
+}

frontend/src/container/BillingContainer/CancelSubscriptionBanner.test.tsx

@@ -0,0 +1,68 @@
+import { render, screen, userEvent } from 'tests/test-utils';
+
+import CancelSubscriptionBanner from './CancelSubscriptionBanner';
+
+jest.mock('utils/basePath', () => ({
+	getBasePath: (): string => '/',
+	withBasePath: (path: string): string => path,
+	getAbsoluteUrl: (path: string): string => `https://test.signoz.io${path}`,
+	getBaseUrl: (): string => 'https://test.signoz.io',
+}));
+
+describe('CancelSubscriptionBanner', () => {
+	it('renders banner with title and subtitle', () => {
+		render(<CancelSubscriptionBanner />);
+		expect(
+			screen.getByText('Cancel Subscription', { selector: 'span' }),
+		).toBeInTheDocument();
+		expect(
+			screen.getByText('Cancel your SigNoz subscription.'),
+		).toBeInTheDocument();
+	});
+
+	it('opens dialog with correct content when Cancel Subscription is clicked', async () => {
+		const user = userEvent.setup({ pointerEventsCheck: 0 });
+		render(<CancelSubscriptionBanner />);
+
+		await user.click(
+			screen.getByRole('button', { name: /cancel subscription/i }),
+		);
+
+		expect(screen.getByRole('dialog')).toBeInTheDocument();
+		expect(
+			screen.getByText(/reach out to our support team/i),
+		).toBeInTheDocument();
+		expect(
+			screen.getByRole('button', { name: /keep subscription/i }),
+		).toBeInTheDocument();
+		expect(
+			screen.getByRole('button', { name: /contact support/i }),
+		).toBeInTheDocument();
+	});
+
+	it('sends mailto to cloud-support with correct subject on Contact Support', async () => {
+		const realCreateElement = document.createElement.bind(document);
+		const mockClick = jest.fn();
+		const mockAnchor = { href: '', click: mockClick };
+		jest.spyOn(document, 'createElement').mockImplementation((tag: string) => {
+			if (tag === 'a') {
+				return mockAnchor as unknown as HTMLAnchorElement;
+			}
+			return realCreateElement(tag);
+		});
+
+		const user = userEvent.setup({ pointerEventsCheck: 0 });
+		render(<CancelSubscriptionBanner />);
+
+		await user.click(
+			screen.getByRole('button', { name: /cancel subscription/i }),
+		);
+		await user.click(screen.getByRole('button', { name: /contact support/i }));
+
+		expect(mockAnchor.href).toContain('mailto:cloud-support@signoz.io');
+		expect(mockAnchor.href).toContain('Cancel%20My%20SigNoz%20Subscription');
+		expect(mockClick).toHaveBeenCalledTimes(1);
+
+		jest.restoreAllMocks();
+	});
+});

frontend/src/container/BillingContainer/CancelSubscriptionBanner.tsx

@@ -0,0 +1,106 @@
+import { useState } from 'react';
+import { X } from '@signozhq/icons';
+import { Button, DialogWrapper } from '@signozhq/ui';
+import logEvent from 'api/common/logEvent';
+import { pick } from 'lodash-es';
+import { useAppContext } from 'providers/App/App';
+import { getBaseUrl } from 'utils/basePath';
+
+import styles from './CancelSubscriptionBanner.module.scss';
+
+function CancelSubscriptionBanner(): JSX.Element {
+	const [open, setOpen] = useState(false);
+	const { user, org } = useAppContext();
+
+	const handleOpenCancelDialog = (): void => {
+		void logEvent('Billing : Cancel Subscription Clicked', {
+			user: pick(user, ['email', 'displayName', 'role', 'organization']),
+			role: user?.role,
+		});
+		setOpen(true);
+	};
+
+	const handleContactSupport = (): void => {
+		void logEvent('Billing : Cancel Subscription Confirmed', {
+			user: pick(user, ['email', 'displayName', 'role', 'organization']),
+			role: user?.role,
+		});
+		const subject = encodeURIComponent('Cancel My SigNoz Subscription');
+		const orgName = org?.[0]?.displayName ?? '';
+		const body = encodeURIComponent(
+			[
+				'Hi SigNoz Team,',
+				'',
+				'I would like to cancel my SigNoz Cloud subscription.',
+				'Please find my account details below.',
+				'',
+				'Account Details:',
+				`  • SigNoz URL: ${getBaseUrl()}`,
+				...(orgName ? [`  • Organization: ${orgName}`] : []),
+				`  • Account Email: ${user?.email ?? ''}`,
+				'',
+				'Reason for Cancellation:',
+				'[Please share the reason for cancellation]',
+				'',
+				'Additional feedback (optional):',
+				'[Any other feedback]',
+				'',
+				'Regards,',
+				'[user name or team name]',
+			].join('\n'),
+		);
+		const link = document.createElement('a');
+		link.href = `mailto:cloud-support@signoz.io?subject=${subject}&body=${body}`;
+		link.click();
+		setOpen(false);
+	};
+
+	const footer = (
+		<>
+			<Button
+				variant="solid"
+				color="secondary"
+				onClick={(): void => setOpen(false)}
+			>
+				Keep Subscription
+			</Button>
+			<Button variant="solid" color="destructive" onClick={handleContactSupport}>
+				Contact Support
+			</Button>
+		</>
+	);
+
+	return (
+		<>
+			<div className={styles.banner}>
+				<div className={styles.info}>
+					<span className={styles.title}>Cancel Subscription</span>
+					<span className={styles.subtitle}>Cancel your SigNoz subscription.</span>
+				</div>
+				<Button
+					variant="solid"
+					color="destructive"
+					prefix={<X size={12} />}
+					onClick={handleOpenCancelDialog}
+				>
+					Cancel Subscription
+				</Button>
+			</div>
+			<DialogWrapper
+				open={open}
+				onOpenChange={setOpen}
+				title="Cancel your subscription"
+				width="narrow"
+				showCloseButton={false}
+				footer={footer}
+			>
+				<p className={styles.dialogBody}>
+					To cancel your SigNoz subscription, please reach out to our support team.
+					We&apos;ll be happy to assist you.
+				</p>
+			</DialogWrapper>
+		</>
+	);
+}
+
+export default CancelSubscriptionBanner;

frontend/src/tests/test-utils.tsx

@@ -119,7 +119,7 @@ export function getAppContextMock(
 				status: '',
 				updated_at: '0',
 			},
-			state: LicenseState.ACTIVE,
+			state: LicenseState.ACTIVATED,
 			status: LicenseStatus.VALID,
 			platform: LicensePlatform.CLOUD,
 			created_at: '0',

frontend/src/types/api/licensesV3/getActive.ts

@@ -11,7 +11,7 @@ export enum LicenseStatus {
 
 export enum LicenseState {
 	DEFAULTED = 'DEFAULTED',
-	ACTIVE = 'ACTIVE',
+	ACTIVATED = 'ACTIVATED',
 	EXPIRED = 'EXPIRED',
 	ISSUED = 'ISSUED',
 	EVALUATING = 'EVALUATING',

pkg/signoz/openapi.go

@@ -98,8 +98,31 @@ func NewOpenAPI(ctx context.Context, instrumentation instrumentation.Instrumenta
 		return defaultDefName
 	}))
 
-	reflector.SpecSchema().SetTitle("SigNoz")
-	reflector.SpecSchema().SetDescription("OpenTelemetry-Native Logs, Metrics and Traces in a single pane")
+	reflector.Spec.WithInfo(*(&openapi3.Info{}).
+		WithTitle("SigNoz").
+		WithDescription("OpenTelemetry-Native Logs, Metrics and Traces in a single pane").
+		WithTermsOfService("https://signoz.io/terms-of-service/").
+		WithContact(*(&openapi3.Contact{}).
+			WithName("SigNoz Support").
+			WithURL("https://signoz.io").
+			WithEmail("support@signoz.io")),
+	)
+
+	reflector.Spec.WithServers(
+		// Default server
+		*(&openapi3.Server{}).WithURL("https://{host}:{port}{base_path}").
+			WithDescription("The fully qualified URL to the SigNoz APIServer.").
+			WithVariablesItem("host", *(&openapi3.ServerVariable{}).
+				WithDefault("localhost").
+				WithDescription("The host of the SigNoz APIServer")).
+			WithVariablesItem("port", *(&openapi3.ServerVariable{}).
+				WithDefault("8080").
+				WithDescription("The port of the SigNoz APIServer")).
+			WithVariablesItem("base_path", *(&openapi3.ServerVariable{}).
+				WithDefault("/").
+				WithDescription("The base path of the SigNoz APIServer")),
+	)
+
 	reflector.SpecSchema().SetAPIKeySecurity(authtypes.IdentNProviderAPIKey.StringValue(), "SigNoz-Api-Key", openapi.InHeader, "API Keys")
 	reflector.SpecSchema().SetHTTPBearerTokenSecurity(authtypes.IdentNProviderTokenizer.StringValue(), "Tokenizer", "Tokens generated by the tokenizer")