From 0c176822a6770f2504940503e0da643b19bf85ac Mon Sep 17 00:00:00 2001 From: muhammad-ahmed Date: Mon, 23 Feb 2026 12:38:19 +0800 Subject: [PATCH 01/18] feat: refactor to convert it to legacy --- .github/actions/publish_to_pages/action.yml | 2 +- .../publish_to_pages_production/action.yml | 2 +- .github/workflows/release_production.yml | 6 ++-- docusaurus.config.js | 4 +-- .../trading/residence-list/index.md | 2 +- src/components/Layout/CustomLayout.tsx | 2 +- .../LegacyBanner/LegacyBanner.module.scss | 32 +++++++++++++++++++ src/components/LegacyBanner/index.tsx | 24 ++++++++++++++ .../UserNavbarItem/item.desktop.tsx | 14 -------- src/hooks/useSignUp/index.tsx | 2 +- src/theme/Layout/index.tsx | 2 ++ .../MobileSidebar/PrimaryMenu/index.tsx | 14 +------- src/utils/__tests__/utils.test.ts | 4 +-- src/utils/index.ts | 32 +++++++++---------- static/img/derivlogo.svg | 18 ++++++----- 15 files changed, 97 insertions(+), 63 deletions(-) create mode 100644 src/components/LegacyBanner/LegacyBanner.module.scss create mode 100644 src/components/LegacyBanner/index.tsx diff --git a/.github/actions/publish_to_pages/action.yml b/.github/actions/publish_to_pages/action.yml index 8e1302e78..27b84cdac 100644 --- a/.github/actions/publish_to_pages/action.yml +++ b/.github/actions/publish_to_pages/action.yml @@ -26,5 +26,5 @@ runs: npm i wrangler@3.10.1 cd build npx wrangler pages deploy . --project-name=$PROJECT_NAME --branch=$CF_BRANCH - echo "New staging website - https://$CF_BRANCH-api.deriv.com/" + echo "New staging website - https://$CF_BRANCH-legacy-api.deriv.com/" shell: bash diff --git a/.github/actions/publish_to_pages_production/action.yml b/.github/actions/publish_to_pages_production/action.yml index ca2822f18..d580bb0ec 100644 --- a/.github/actions/publish_to_pages_production/action.yml +++ b/.github/actions/publish_to_pages_production/action.yml @@ -18,5 +18,5 @@ runs: npm i wrangler@3.10.1 cd build npx wrangler pages deploy . --project-name=deriv-developers-portal-pages --branch=main - echo "New website - https://api.deriv.com" + echo "New website - https://legacy-api.deriv.com" shell: bash diff --git a/.github/workflows/release_production.yml b/.github/workflows/release_production.yml index 5c1898eb1..a3890b26d 100644 --- a/.github/workflows/release_production.yml +++ b/.github/workflows/release_production.yml @@ -65,9 +65,9 @@ jobs: id: create_slack_message run: | if [ "$WORKFLOW_CONCLUSION" == "success" ]; then - echo "MESSAGE=$RELEASE_TYPE Release succeeded for api.deriv.com with version *${{ needs.build_and_publish.outputs.RELEASE_VERSION }}*" >> $GITHUB_OUTPUT + echo "MESSAGE=$RELEASE_TYPE Release succeeded for legacy-api.deriv.com with version *${{ needs.build_and_publish.outputs.RELEASE_VERSION }}*" >> $GITHUB_OUTPUT else - echo "MESSAGE=$RELEASE_TYPE Release failed for api.deriv.com with version *${{ needs.build_and_publish.outputs.RELEASE_VERSION }}*" >> $GITHUB_OUTPUT + echo "MESSAGE=$RELEASE_TYPE Release failed for legacy-api.deriv.com with version *${{ needs.build_and_publish.outputs.RELEASE_VERSION }}*" >> $GITHUB_OUTPUT fi - name: Send Slack Notification uses: ./.github/actions/notify_slack @@ -105,4 +105,4 @@ jobs: uses: ./.github/actions/notify_slack with: SLACK_WEBHOOK_URL: ${{ secrets.SLACK_WEBHOOK_URL }} - MESSAGE: "Publish to vercel failed for '${{ env.RELEASE_TYPE }}' release on api.deriv.com with version *'${{ needs.build_and_publish.outputs.RELEASE_VERSION }}" + MESSAGE: "Publish to vercel failed for '${{ env.RELEASE_TYPE }}' release on legacy-api.deriv.com with version *'${{ needs.build_and_publish.outputs.RELEASE_VERSION }}" diff --git a/docusaurus.config.js b/docusaurus.config.js index 32129cd7e..30bf62782 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -6,9 +6,9 @@ const darkTheme = themes.vsDark; /** @type {import('@docusaurus/types').Config} */ const config = { - title: 'Deriv API', + title: 'Legacy Deriv API', tagline: 'Create your own apps', - url: 'https://api.deriv.com', + url: 'https://legacy-api.deriv.com', baseUrl: '/', onBrokenLinks: 'throw', onBrokenMarkdownLinks: 'warn', diff --git a/i18n/fr/docusaurus-plugin-content-docs/current/_terminology/trading/residence-list/index.md b/i18n/fr/docusaurus-plugin-content-docs/current/_terminology/trading/residence-list/index.md index 2f3894009..b736f619a 100644 --- a/i18n/fr/docusaurus-plugin-content-docs/current/_terminology/trading/residence-list/index.md +++ b/i18n/fr/docusaurus-plugin-content-docs/current/_terminology/trading/residence-list/index.md @@ -70,4 +70,4 @@ La liste d'exemples peut ressembler à ceci : ] ``` -Vous pouvez en savoir plus sur la "Liste des pays" sur [API Explorer - Liste des pays] (https://api.deriv.com/api-explorer#residence_list) +Vous pouvez en savoir plus sur la "Liste des pays" sur [API Explorer - Liste des pays] (https://legacy-api.deriv.com/api-explorer#residence_list) diff --git a/src/components/Layout/CustomLayout.tsx b/src/components/Layout/CustomLayout.tsx index 721c49a46..18bff0177 100644 --- a/src/components/Layout/CustomLayout.tsx +++ b/src/components/Layout/CustomLayout.tsx @@ -108,7 +108,7 @@ const CustomLayout: React.FC = () => { ) : ( <> - Deriv API | Customise your trading app + Legacy Deriv API | Customise your trading app { + return ( +
+ + + You're on the Legacy Deriv API. We've launched a new and improved version. + + + +
+ ); +}; diff --git a/src/components/UserNavbarItem/item.desktop.tsx b/src/components/UserNavbarItem/item.desktop.tsx index 42140ec01..7afc75105 100644 --- a/src/components/UserNavbarItem/item.desktop.tsx +++ b/src/components/UserNavbarItem/item.desktop.tsx @@ -15,7 +15,6 @@ import useAuthContext from '@site/src/hooks/useAuthContext'; import CustomTooltip from '../CustomTooltip'; import useTMB from '@site/src/hooks/useTmb'; import useTmbEnabled from '@site/src/hooks/useTmbEnabled'; -import useSignUp from '@site/src/hooks/useSignUp'; interface IActionProps { handleClick: () => void; @@ -78,8 +77,6 @@ const SignedInActions: React.FC = ({ handleClick, isDesktop, siteA onClickLogin: handleClick, }); - const { handleSignUp } = useSignUp(); - const renderSignupBtn = () => { return ( ); }; diff --git a/src/hooks/useSignUp/index.tsx b/src/hooks/useSignUp/index.tsx index 3c1cb2594..d299ee847 100644 --- a/src/hooks/useSignUp/index.tsx +++ b/src/hooks/useSignUp/index.tsx @@ -16,7 +16,7 @@ export const useSignUp = () => { const handleSignUp = useCallback(() => { const is_en = currentLocale === 'en'; // Properly encode the redirect URL to handle slashes and special characters - const encodedRedirectUrl = encodeURIComponent('https://api.deriv.com/'); + const encodedRedirectUrl = encodeURIComponent('https://legacy-api.deriv.com/'); // Redirect to sign-up page // If language is not English, include it in the URL diff --git a/src/theme/Layout/index.tsx b/src/theme/Layout/index.tsx index 005c2af77..2a16d77f0 100644 --- a/src/theme/Layout/index.tsx +++ b/src/theme/Layout/index.tsx @@ -11,6 +11,7 @@ import LayoutProvider from '@theme/Layout/Provider'; import ErrorPageContent from '@theme/ErrorPageContent'; import type { Props } from '@theme/Layout'; import { Header } from '@site/src/components/Header'; +import { LegacyBanner } from '@site/src/components/LegacyBanner'; import useOfficialContentsContext from '@site/src/hooks/useOfficialContentsContext'; import styles from './styles.module.css'; @@ -34,6 +35,7 @@ export default function Layout(props: Props): JSX.Element { +
= ({ mobileSidebar }) => { - const { is_logged_in } = useAuthContext(); - const { handleSignUp } = useSignUp(); - - return ( -
- {!is_logged_in && ( - - )} -
- ); + return
; }; export default function CustomMobileSidebar() { diff --git a/src/utils/__tests__/utils.test.ts b/src/utils/__tests__/utils.test.ts index d9c3f16b4..0095cedea 100644 --- a/src/utils/__tests__/utils.test.ts +++ b/src/utils/__tests__/utils.test.ts @@ -45,12 +45,12 @@ describe('Get App ID', () => { expect(appId).toBe('35073'); }); it("Should return 36545 when it's called in staging environment", () => { - window.location.hostname = 'staging-api.deriv.com'; + window.location.hostname = 'staging-legacy-api.deriv.com'; const appId = getAppId(); expect(appId).toBe('36545'); }); it("Should return 36544 when it's called in production environment", () => { - window.location.hostname = 'api.deriv.com'; + window.location.hostname = 'legacy-api.deriv.com'; const appId = getAppId(); expect(appId).toBe('36544'); }); diff --git a/src/utils/index.ts b/src/utils/index.ts index f2d9f9f2b..4049e1e7c 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -31,12 +31,12 @@ const CURRENCY_MAP = new Map([ ]); export const domains = [ - 'deriv.be', - 'deriv.me', - 'deriv.com', - 'api.deriv.me', - 'api.deriv.be', - 'api.deriv.com', + 'legacy-deriv.be', + 'legacy-deriv.me', + 'legacy-deriv.com', + 'legacy-api.deriv.me', + 'legacy-api.deriv.be', + 'legacy-api.deriv.com', 'staging.deriv.be', 'staging.deriv.me', 'staging.deriv.com', @@ -45,9 +45,9 @@ export const domains = [ 'deriv-developers-portal-git-fork', 'deriv-api-docs-git-fork', 'binary.sx', - 'staging-api.deriv.be', - 'staging-api.deriv.me', - 'staging-api.deriv.com', + 'staging-legacy-api.deriv.be', + 'staging-legacy-api.deriv.me', + 'staging-legacy-api.deriv.com', 'api.binary.sx', 'staging-api.binary.sx', ]; @@ -89,13 +89,13 @@ export const isHost = (hostname: string) => { */ export const getAppId = () => { if (isHost('localhost')) return LOCALHOST_APP_ID; - if (isHost('staging-api.deriv.com')) return STAGING_APP_ID; + if (isHost('staging-legacy-api.deriv.com')) return STAGING_APP_ID; if (isHost('deriv-api-docs.binary.sx')) return VERCEL_DEPLOYMENT_APP_ID; - if (isHost('staging-api.deriv.me')) return STAGING_ME_APP_ID; - if (isHost('staging-api.deriv.be')) return STAGING_BE_APP_ID; - if (isHost('api.deriv.com')) return PRODUCTION_APP_ID; - if (isHost('api.deriv.me')) return PRODUCTION_ME_APP_ID; - if (isHost('api.deriv.be')) return PRODUCTION_BE_APP_ID; + if (isHost('staging-legacy-api.deriv.me')) return STAGING_ME_APP_ID; + if (isHost('staging-legacy-api.deriv.be')) return STAGING_BE_APP_ID; + if (isHost('legacy-api.deriv.com')) return PRODUCTION_APP_ID; + if (isHost('legacy-api.deriv.me')) return PRODUCTION_ME_APP_ID; + if (isHost('legacy-api.deriv.be')) return PRODUCTION_BE_APP_ID; return PRODUCTION_APP_ID; }; @@ -263,7 +263,7 @@ export const hasDuplicateKeys = (jsonStr: string) => { export const getTmbConfigUrl = () => { if (typeof window === 'undefined') return ''; - const isProduction = window.location.hostname === 'api.deriv.com'; + const isProduction = window.location.hostname === 'legacy-api.deriv.com'; return isProduction ? 'https://app-config-prod.firebaseio.com/remote_config/oauth/is_tmb_enabled.json' : 'https://app-config-staging.firebaseio.com/remote_config/oauth/is_tmb_enabled.json'; diff --git a/static/img/derivlogo.svg b/static/img/derivlogo.svg index d854d896d..a943617e3 100644 --- a/static/img/derivlogo.svg +++ b/static/img/derivlogo.svg @@ -1,13 +1,15 @@ - - - - - - + + + + + + + + - - + + From 214cdb0b72d7725d1070b5adf0e73f9988dc298a Mon Sep 17 00:00:00 2001 From: muhammad-ahmed Date: Mon, 23 Feb 2026 13:02:14 +0800 Subject: [PATCH 02/18] chore: update unit test --- .../__tests__/item.desktop.test.tsx | 15 --------------- 1 file changed, 15 deletions(-) diff --git a/src/components/UserNavbarItem/__tests__/item.desktop.test.tsx b/src/components/UserNavbarItem/__tests__/item.desktop.test.tsx index 675601d2b..84f47af1e 100644 --- a/src/components/UserNavbarItem/__tests__/item.desktop.test.tsx +++ b/src/components/UserNavbarItem/__tests__/item.desktop.test.tsx @@ -70,20 +70,5 @@ describe('User Navbar Desktop Item', () => { }); expect(location.pathname).toBe('/dashboard'); }); - - it('should click on sign up button', async () => { - const updatedProps = { - ...initialProps, - is_logged_in: false, - }; - renderDashboardActions(updatedProps); - const signUp_button = screen.getByTestId('sa_signup'); - expect(signUp_button).toBeInTheDocument(); - await act(async () => { - await userEvent.click(signUp_button); - }); - // No need to check location.href since handleSignUp is mocked and doesn't do actual navigation - expect(signUp_button).toBeInTheDocument(); - }); }); }); From 515c6f7fe472802307f828d88d2e391242964169 Mon Sep 17 00:00:00 2001 From: muhammad-ahmed Date: Mon, 23 Feb 2026 14:28:48 +0800 Subject: [PATCH 03/18] chore: add update page and route from banner --- src/components/LegacyBanner/index.tsx | 12 +- .../Updates/CTAFooter/CTAFooter.module.scss | 48 ++++++++ src/features/Updates/CTAFooter/CTAFooter.tsx | 30 +++++ src/features/Updates/FAQ/FAQ.module.scss | 36 ++++++ src/features/Updates/FAQ/FAQ.tsx | 101 +++++++++++++++++ src/features/Updates/Hero/Hero.module.scss | 86 +++++++++++++++ src/features/Updates/Hero/Hero.tsx | 47 ++++++++ .../HowToGetStarted.module.scss | 82 ++++++++++++++ .../HowToGetStarted/HowToGetStarted.tsx | 59 ++++++++++ .../ImportantNotice.module.scss | 67 ++++++++++++ .../ImportantNotice/ImportantNotice.tsx | 34 ++++++ .../Updates/PageFooter/PageFooter.module.scss | 47 ++++++++ .../Updates/PageFooter/PageFooter.tsx | 27 +++++ .../Updates/WhatsNew/WhatsNew.module.scss | 96 ++++++++++++++++ src/features/Updates/WhatsNew/WhatsNew.tsx | 103 ++++++++++++++++++ src/features/Updates/index.tsx | 23 ++++ src/features/Updates/styles.module.scss | 5 + src/pages/updates.tsx | 16 +++ 18 files changed, 912 insertions(+), 7 deletions(-) create mode 100644 src/features/Updates/CTAFooter/CTAFooter.module.scss create mode 100644 src/features/Updates/CTAFooter/CTAFooter.tsx create mode 100644 src/features/Updates/FAQ/FAQ.module.scss create mode 100644 src/features/Updates/FAQ/FAQ.tsx create mode 100644 src/features/Updates/Hero/Hero.module.scss create mode 100644 src/features/Updates/Hero/Hero.tsx create mode 100644 src/features/Updates/HowToGetStarted/HowToGetStarted.module.scss create mode 100644 src/features/Updates/HowToGetStarted/HowToGetStarted.tsx create mode 100644 src/features/Updates/ImportantNotice/ImportantNotice.module.scss create mode 100644 src/features/Updates/ImportantNotice/ImportantNotice.tsx create mode 100644 src/features/Updates/PageFooter/PageFooter.module.scss create mode 100644 src/features/Updates/PageFooter/PageFooter.tsx create mode 100644 src/features/Updates/WhatsNew/WhatsNew.module.scss create mode 100644 src/features/Updates/WhatsNew/WhatsNew.tsx create mode 100644 src/features/Updates/index.tsx create mode 100644 src/features/Updates/styles.module.scss create mode 100644 src/pages/updates.tsx diff --git a/src/components/LegacyBanner/index.tsx b/src/components/LegacyBanner/index.tsx index 3e361e0b8..2a4f880c3 100644 --- a/src/components/LegacyBanner/index.tsx +++ b/src/components/LegacyBanner/index.tsx @@ -1,9 +1,12 @@ import React from 'react'; import { Button } from '@deriv-com/quill-ui'; +import { useHistory } from '@docusaurus/router'; import Translate from '@docusaurus/Translate'; import styles from './LegacyBanner.module.scss'; export const LegacyBanner = () => { + const history = useHistory(); + return (
@@ -11,13 +14,8 @@ export const LegacyBanner = () => { You're on the Legacy Deriv API. We've launched a new and improved version. -
); diff --git a/src/features/Updates/CTAFooter/CTAFooter.module.scss b/src/features/Updates/CTAFooter/CTAFooter.module.scss new file mode 100644 index 000000000..a48ede9cd --- /dev/null +++ b/src/features/Updates/CTAFooter/CTAFooter.module.scss @@ -0,0 +1,48 @@ +@use '../../../styles/utility' as *; +@use '../../../styles/mixins' as *; + +.ctaSection { + background: #0d0d0d; + padding: rem(9.6) rem(2.4); + + @include mobile { + padding: rem(6.4) rem(1.6); + } +} + +.ctaContent { + max-width: rem(72); + margin: 0 auto; + text-align: center; + display: flex; + flex-direction: column; + align-items: center; + gap: rem(2.4); +} + +.ctaTitle { + color: #ffffff; + font-size: rem(4); + font-weight: 700; + line-height: 1.2; + margin: 0; + + @include mobile { + font-size: rem(2.8); + } +} + +.ctaSubtitle { + color: rgba(255, 255, 255, 0.7); + font-size: rem(1.6); + line-height: 1.6; + max-width: rem(56); + margin: 0; +} + +.ctaButton { + border-radius: rem(10) !important; + font-weight: 700 !important; + padding-left: rem(2.4) !important; + padding-right: rem(2.4) !important; +} diff --git a/src/features/Updates/CTAFooter/CTAFooter.tsx b/src/features/Updates/CTAFooter/CTAFooter.tsx new file mode 100644 index 000000000..66b3f376e --- /dev/null +++ b/src/features/Updates/CTAFooter/CTAFooter.tsx @@ -0,0 +1,30 @@ +import React from 'react'; +import Translate from '@docusaurus/Translate'; +import { Button } from '@deriv-com/quill-ui'; +import styles from './CTAFooter.module.scss'; + +export const CTAFooter = () => { + return ( +
+
+

+ Ready to explore the new Deriv APIs? +

+

+ + Create your account and start building with OAuth 2.0 security and improved + documentation. + +

+ +
+
+ ); +}; diff --git a/src/features/Updates/FAQ/FAQ.module.scss b/src/features/Updates/FAQ/FAQ.module.scss new file mode 100644 index 000000000..bca8b156b --- /dev/null +++ b/src/features/Updates/FAQ/FAQ.module.scss @@ -0,0 +1,36 @@ +@use '../../../styles/utility' as *; +@use '../../../styles/mixins' as *; + +.faqSection { + background: #ffffff; + padding: rem(6.4) rem(2.4); + border-top: 1px solid #f0f0f0; + + @include mobile { + padding: rem(4.8) rem(1.6); + } +} + +.container { + max-width: rem(80); + margin: 0 auto; +} + +.sectionTitle { + text-align: center; + font-size: rem(3.6); + font-weight: 700; + color: #181c25; + margin-bottom: rem(1.6); + + @include mobile { + font-size: rem(2.4); + } +} + +.sectionSubtitle { + text-align: center; + font-size: rem(1.6); + color: #5c6374; + margin-bottom: rem(4.8); +} diff --git a/src/features/Updates/FAQ/FAQ.tsx b/src/features/Updates/FAQ/FAQ.tsx new file mode 100644 index 000000000..b64de73df --- /dev/null +++ b/src/features/Updates/FAQ/FAQ.tsx @@ -0,0 +1,101 @@ +import React from 'react'; +import Translate from '@docusaurus/Translate'; +import CustomAccordion from '@site/src/components/CustomAccordion'; +import styles from './FAQ.module.scss'; + +const FAQ_ITEMS = [ + { + header: 'Will my existing apps still work?', + content: ( +

+ + Yes. All existing apps and integrations on the legacy Deriv API will continue to function + as before. You do not need to migrate immediately. + +

+ ), + }, + { + header: 'Can my existing apps sign in new users?', + content: ( +

+ + Yes, your existing apps can still authenticate users through the legacy platform. However, + new sign-ups on the new platform will require accounts created on developers.deriv.com. + +

+ ), + }, + { + header: 'What happens to my current traders?', + content: ( +

+ + Your current traders are not affected. They can continue using your app without any + changes. The migration only concerns developer accounts and API access. + +

+ ), + }, + { + header: 'Can I still sign up on the legacy Deriv APIs?', + content: ( +

+ + The legacy platform remains accessible, but we encourage new developers to start on the + new Deriv APIs at developers.deriv.com to take advantage of OAuth 2.0 and all the new + features. + +

+ ), + }, + { + header: "I'm a new developer. Where do I start?", + content: ( +

+ + Head to developers.deriv.com to create your account and explore the new APIs. The new + platform offers better documentation, AI tools, and a more secure authentication system. + +

+ ), + }, + { + header: 'Why does the URL say "legacy-api.deriv.com"?', + content: ( +

+ + This site has been updated to reflect that it is the legacy version of the Deriv API + documentation. The new platform is available at developers.deriv.com. + +

+ ), + }, + { + header: 'How do I get help?', + content: ( +

+ + You can reach our support team through the Help centre at deriv.com/help-centre or contact + us directly at developers.deriv.com. + +

+ ), + }, +]; + +export const FAQ = () => { + return ( +
+
+

+ Frequently asked questions +

+

+ Common questions about the new Deriv APIs and the transition. +

+ +
+
+ ); +}; diff --git a/src/features/Updates/Hero/Hero.module.scss b/src/features/Updates/Hero/Hero.module.scss new file mode 100644 index 000000000..18ee5b0bb --- /dev/null +++ b/src/features/Updates/Hero/Hero.module.scss @@ -0,0 +1,86 @@ +@use '../../../styles/utility' as *; +@use '../../../styles/mixins' as *; + +.heroSection { + background-color: #0d0d0d; + padding: rem(9.6) rem(2.4); + + @include mobile { + padding: rem(6.4) rem(1.6); + } +} + +.heroContent { + max-width: rem(80); + margin: 0 auto; + display: flex; + flex-direction: column; + align-items: center; + text-align: center; +} + +.headline { + color: #ffffff; + font-size: rem(5.6); + font-weight: 700; + line-height: 1.15; + margin-bottom: rem(2.4); + + @include mobile { + font-size: rem(3.2); + } +} + +.coral { + color: #ff444f; +} + +.subtitle { + color: rgba(255, 255, 255, 0.75); + font-size: rem(1.8); + line-height: 1.6; + max-width: rem(64); + margin-bottom: rem(3.6); + + @include mobile { + font-size: rem(1.5); + } +} + +.pillRow { + display: flex; + flex-wrap: wrap; + gap: rem(1.2); + justify-content: center; + margin-bottom: rem(4); +} + +.pill { + border: 1px solid rgba(255, 255, 255, 0.25); + color: rgba(255, 255, 255, 0.85); + border-radius: rem(10); + padding: rem(0.6) rem(1.6); + font-size: rem(1.4); + font-weight: 500; +} + +.ctaRow { + display: flex; + gap: rem(1.6); + align-items: center; + + @include mobile { + flex-direction: column; + width: 100%; + } +} + +.primaryBtn { + border-radius: rem(10) !important; + font-weight: 700 !important; +} + +.secondaryBtn { + border-radius: rem(10) !important; + font-weight: 700 !important; +} diff --git a/src/features/Updates/Hero/Hero.tsx b/src/features/Updates/Hero/Hero.tsx new file mode 100644 index 000000000..2fb575d14 --- /dev/null +++ b/src/features/Updates/Hero/Hero.tsx @@ -0,0 +1,47 @@ +import React from 'react'; +import Translate from '@docusaurus/Translate'; +import { Button } from '@deriv-com/quill-ui'; +import styles from './Hero.module.scss'; + +const PILLS = ['OAuth 2.0', 'MCP Server', 'LLMs.txt', 'AI Chatbot']; + +export const Hero = () => { + return ( +
+
+

+ We bring you + + new Deriv APIs + +

+

+ + Far more secure, powered by OAuth 2.0, and a streamlined developer experience. + Here's everything you need to know about the transition. + +

+
+ {PILLS.map((pill) => ( + + {pill} + + ))} +
+
+ + +
+
+
+ ); +}; diff --git a/src/features/Updates/HowToGetStarted/HowToGetStarted.module.scss b/src/features/Updates/HowToGetStarted/HowToGetStarted.module.scss new file mode 100644 index 000000000..0eb63d6d9 --- /dev/null +++ b/src/features/Updates/HowToGetStarted/HowToGetStarted.module.scss @@ -0,0 +1,82 @@ +@use '../../../styles/utility' as *; +@use '../../../styles/mixins' as *; + +.stepsSection { + background: #ffffff; + padding: rem(6.4) rem(2.4); + + @include mobile { + padding: rem(4.8) rem(1.6); + } +} + +.container { + max-width: rem(72); + margin: 0 auto; +} + +.sectionTitle { + text-align: center; + font-size: rem(3.6); + font-weight: 700; + color: #181c25; + margin-bottom: rem(1.6); + + @include mobile { + font-size: rem(2.4); + } +} + +.sectionSubtitle { + text-align: center; + font-size: rem(1.6); + color: #5c6374; + margin-bottom: rem(4.8); +} + +.stepsWrapper { + display: flex; + flex-direction: column; + gap: rem(3.2); +} + +.step { + display: flex; + align-items: flex-start; + gap: rem(2.4); +} + +.stepNumber { + width: rem(4); + height: rem(4); + border-radius: 50%; + background: #ff444f; + color: #ffffff; + display: flex; + align-items: center; + justify-content: center; + font-weight: 700; + font-size: rem(1.6); + flex-shrink: 0; +} + +.stepContent { + display: flex; + flex-direction: column; + gap: rem(0.8); + padding-top: rem(0.4); +} + +.stepTitle { + font-size: rem(1.8); + font-weight: 700; + color: #181c25; + margin: 0; +} + +.stepDescription { + font-size: rem(1.5); + color: #5c6374; + line-height: 1.6; + margin: 0; +} diff --git a/src/features/Updates/HowToGetStarted/HowToGetStarted.tsx b/src/features/Updates/HowToGetStarted/HowToGetStarted.tsx new file mode 100644 index 000000000..f22d95bca --- /dev/null +++ b/src/features/Updates/HowToGetStarted/HowToGetStarted.tsx @@ -0,0 +1,59 @@ +import React from 'react'; +import Translate from '@docusaurus/Translate'; +import styles from './HowToGetStarted.module.scss'; + +type TStep = { + number: number; + title: string; + description: string; +}; + +const STEPS: TStep[] = [ + { + number: 1, + title: 'Visit developers.deriv.com', + description: 'Go to developers.deriv.com to access the new Deriv APIs.', + }, + { + number: 2, + title: 'Create a new account', + description: + "Click Sign up and register. Your existing legacy credentials won't work here — a new account is required.", + }, + { + number: 3, + title: 'Start building', + description: + 'Explore the APIs, create applications, generate tokens, and use the AI tools and documentation.', + }, +]; + +const Step = ({ step }: { step: TStep }) => ( +
+
{step.number}
+
+
{step.title}
+

{step.description}

+
+
+); + +export const HowToGetStarted = () => { + return ( +
+
+

+ How to get started +

+

+ Three steps to set up your account on the new Deriv APIs. +

+
+ {STEPS.map((step) => ( + + ))} +
+
+
+ ); +}; diff --git a/src/features/Updates/ImportantNotice/ImportantNotice.module.scss b/src/features/Updates/ImportantNotice/ImportantNotice.module.scss new file mode 100644 index 000000000..2395b6ca8 --- /dev/null +++ b/src/features/Updates/ImportantNotice/ImportantNotice.module.scss @@ -0,0 +1,67 @@ +@use '../../../styles/utility' as *; +@use '../../../styles/mixins' as *; + +.noticeSection { + background: #ffffff; + padding: rem(4.8) rem(2.4); + + @include mobile { + padding: rem(3.2) rem(1.6); + } +} + +.noticeCard { + max-width: rem(80); + margin: 0 auto; + border-left: rem(0.4) solid #ff444f; + border-radius: 0 rem(0.8) rem(0.8) 0; + padding: rem(2.4) rem(3.2); + box-shadow: 0 rem(0.2) rem(1.6) rgba(0, 0, 0, 0.08); + display: flex; + flex-direction: column; + gap: rem(1.2); + + @include mobile { + padding: rem(2) rem(1.6); + } +} + +.noticeHeader { + display: flex; + align-items: center; + gap: rem(1.2); + margin-bottom: rem(0.4); +} + +.noticeIcon { + color: #ff444f; + flex-shrink: 0; +} + +.noticeTitle { + font-size: rem(1.8); + font-weight: 700; + color: #181c25; + margin: 0; +} + +.noticeBody { + font-size: rem(1.5); + color: #181c25; + line-height: 1.6; + margin: 0; +} + +.noticeBold { + font-size: rem(1.5); + font-weight: 700; + color: #181c25; + line-height: 1.6; + margin: 0; +} + +.noticeSmall { + font-size: rem(1.3); + color: #5c6374; + margin: 0; +} diff --git a/src/features/Updates/ImportantNotice/ImportantNotice.tsx b/src/features/Updates/ImportantNotice/ImportantNotice.tsx new file mode 100644 index 000000000..3c58a50c7 --- /dev/null +++ b/src/features/Updates/ImportantNotice/ImportantNotice.tsx @@ -0,0 +1,34 @@ +import React from 'react'; +import Translate from '@docusaurus/Translate'; +import { StandaloneCircleInfoBoldIcon } from '@deriv/quill-icons'; +import styles from './ImportantNotice.module.scss'; + +export const ImportantNotice = () => { + return ( +
+
+
+ +

+ Important notice for existing developers +

+
+

+ + Your existing apps and integrations will continue to work on this legacy platform. You + do not need to migrate immediately — your current setup remains functional. + +

+

+ + However, to access the new Deriv APIs, you will need to create a new account on + developers.deriv.com. Your existing legacy credentials will not work there. + +

+

+ New users and traders do not need to take any action. +

+
+
+ ); +}; diff --git a/src/features/Updates/PageFooter/PageFooter.module.scss b/src/features/Updates/PageFooter/PageFooter.module.scss new file mode 100644 index 000000000..3af49e667 --- /dev/null +++ b/src/features/Updates/PageFooter/PageFooter.module.scss @@ -0,0 +1,47 @@ +@use '../../../styles/utility' as *; +@use '../../../styles/mixins' as *; + +.pageFooter { + background: #0d0d0d; + padding: rem(3.2) rem(2.4); + border-top: 1px solid rgba(255, 255, 255, 0.08); + display: flex; + flex-direction: column; + align-items: center; + gap: rem(1.6); + + @include mobile { + padding: rem(2.4) rem(1.6); + } +} + +.footerLinks { + display: flex; + gap: rem(1.6); + flex-wrap: wrap; + justify-content: center; + align-items: center; +} + +.footerLink { + color: rgba(255, 255, 255, 0.6) !important; + text-decoration: none !important; + font-size: rem(1.4); + transition: color 0.2s; + + &:hover { + color: #ffffff !important; + text-decoration: none !important; + } +} + +.separator { + color: rgba(255, 255, 255, 0.25); + font-size: rem(1.4); +} + +.copyright { + color: rgba(255, 255, 255, 0.35); + font-size: rem(1.3); + margin: 0; +} diff --git a/src/features/Updates/PageFooter/PageFooter.tsx b/src/features/Updates/PageFooter/PageFooter.tsx new file mode 100644 index 000000000..03b6b952c --- /dev/null +++ b/src/features/Updates/PageFooter/PageFooter.tsx @@ -0,0 +1,27 @@ +import React from 'react'; +import Link from '@docusaurus/Link'; +import Translate from '@docusaurus/Translate'; +import styles from './PageFooter.module.scss'; + +export const PageFooter = () => { + return ( +
+
+ + New Deriv APIs + + | + + Deriv.com + + | + + Help centre + +
+

+ © 2026 Deriv. All rights reserved. +

+
+ ); +}; diff --git a/src/features/Updates/WhatsNew/WhatsNew.module.scss b/src/features/Updates/WhatsNew/WhatsNew.module.scss new file mode 100644 index 000000000..a464fab51 --- /dev/null +++ b/src/features/Updates/WhatsNew/WhatsNew.module.scss @@ -0,0 +1,96 @@ +@use '../../../styles/utility' as *; +@use '../../../styles/mixins' as *; + +.whatsNewSection { + background: #f6f7f8; + padding: rem(6.4) rem(2.4); + + @include mobile { + padding: rem(4.8) rem(1.6); + } +} + +.container { + max-width: rem(120); + margin: 0 auto; +} + +.sectionTitle { + text-align: center; + font-size: rem(3.6); + font-weight: 700; + color: #181c25; + margin-bottom: rem(1.6); + + @include mobile { + font-size: rem(2.4); + } +} + +.sectionSubtitle { + text-align: center; + font-size: rem(1.6); + color: #5c6374; + margin-bottom: rem(4.8); + max-width: rem(64); + margin-left: auto; + margin-right: auto; +} + +.cardGrid { + display: grid; + grid-template-columns: 1fr 1fr; + gap: rem(2.4); + + @include tablet { + grid-template-columns: 1fr; + } +} + +.card { + background: #ffffff; + border-radius: rem(1.2); + padding: rem(2.4); + position: relative; + display: flex; + flex-direction: column; + gap: rem(1.2); + box-shadow: 0 rem(0.2) rem(0.8) rgba(0, 0, 0, 0.06); +} + +.iconWrapper { + width: rem(4.8); + height: rem(4.8); + border-radius: rem(0.8); + display: flex; + align-items: center; + justify-content: center; + flex-shrink: 0; +} + +.badge { + position: absolute; + top: rem(1.6); + right: rem(1.6); + background: #2196f3; + color: #ffffff; + border-radius: rem(0.4); + padding: rem(0.3) rem(0.8); + font-size: rem(1); + font-weight: 700; + letter-spacing: 0.05em; +} + +.cardTitle { + font-size: rem(1.6); + font-weight: 700; + color: #181c25; + margin: 0; +} + +.cardDescription { + font-size: rem(1.4); + color: #5c6374; + line-height: 1.6; + margin: 0; +} diff --git a/src/features/Updates/WhatsNew/WhatsNew.tsx b/src/features/Updates/WhatsNew/WhatsNew.tsx new file mode 100644 index 000000000..67f9dd223 --- /dev/null +++ b/src/features/Updates/WhatsNew/WhatsNew.tsx @@ -0,0 +1,103 @@ +import React from 'react'; +import Translate from '@docusaurus/Translate'; +import { + StandaloneShieldCheckBoldIcon, + StandaloneLightbulbBoldIcon, + StandaloneBookCircleQuestionBoldIcon, + StandaloneGearBoldIcon, + StandaloneChartLineBoldIcon, + StandaloneStarBoldIcon, +} from '@deriv/quill-icons'; +import styles from './WhatsNew.module.scss'; + +type TCard = { + iconBg: string; + icon: React.ReactNode; + title: string; + description: string; + comingSoon?: boolean; +}; + +const CARDS: TCard[] = [ + { + iconBg: '#ffeef0', + icon: , + title: 'OAuth 2.0 authentication', + description: + 'Industry-standard secure authentication that gives developers fine-grained access control and eliminates the need to share credentials.', + }, + { + iconBg: '#f3eeff', + icon: , + title: 'AI-powered features', + description: + 'Built-in AI tools including an AI chatbot, LLMs.txt support, and MCP Server integration to supercharge your development workflow.', + }, + { + iconBg: '#e8f4ff', + icon: , + title: 'Better documentation', + description: + 'Fully redesigned docs with interactive examples, clearer guides, and improved search to help you build faster.', + }, + { + iconBg: '#eefff5', + icon: , + title: 'Your existing apps still work', + description: + 'All your current integrations continue to function on the legacy platform. No action required on your part.', + }, + { + iconBg: '#e8f0ff', + icon: , + title: 'Analytics dashboard', + description: + 'Track API usage, monitor app performance, and gain insights into how users interact with your applications.', + comingSoon: true, + }, + { + iconBg: '#e8fff3', + icon: , + title: 'And much more', + description: + 'From improved rate limits to new endpoint capabilities, the new Deriv APIs are built for the next generation of developers.', + }, +]; + +const FeatureCard = ({ card }: { card: TCard }) => ( +
+
+ {card.icon} +
+ {card.comingSoon && ( + + COMING SOON + + )} +
{card.title}
+

{card.description}

+
+); + +export const WhatsNew = () => { + return ( +
+
+

+ What's new in the Deriv APIs +

+

+ + Everything you get when you move to the new platform — built for security, speed, and + the future. + +

+
+ {CARDS.map((card) => ( + + ))} +
+
+
+ ); +}; diff --git a/src/features/Updates/index.tsx b/src/features/Updates/index.tsx new file mode 100644 index 000000000..6a622fb83 --- /dev/null +++ b/src/features/Updates/index.tsx @@ -0,0 +1,23 @@ +import React from 'react'; +import { Hero } from './Hero/Hero'; +import { ImportantNotice } from './ImportantNotice/ImportantNotice'; +import { WhatsNew } from './WhatsNew/WhatsNew'; +import { HowToGetStarted } from './HowToGetStarted/HowToGetStarted'; +import { FAQ } from './FAQ/FAQ'; +import { CTAFooter } from './CTAFooter/CTAFooter'; +import { PageFooter } from './PageFooter/PageFooter'; +import styles from './styles.module.scss'; + +export default function UpdatesFeature() { + return ( +
+ + + + + + + +
+ ); +} diff --git a/src/features/Updates/styles.module.scss b/src/features/Updates/styles.module.scss new file mode 100644 index 000000000..b77de9e46 --- /dev/null +++ b/src/features/Updates/styles.module.scss @@ -0,0 +1,5 @@ +.updates { + width: 100%; + display: flex; + flex-direction: column; +} diff --git a/src/pages/updates.tsx b/src/pages/updates.tsx new file mode 100644 index 000000000..46451053c --- /dev/null +++ b/src/pages/updates.tsx @@ -0,0 +1,16 @@ +import React from 'react'; +import Layout from '@theme/Layout'; +import UpdatesFeature from '../features/Updates'; + +export default function Updates(): JSX.Element { + return ( + + + + ); +} From 8f7deac76c5240bfc3970a9190849dc2f8a9f13b Mon Sep 17 00:00:00 2001 From: muhammad-ahmed Date: Mon, 23 Feb 2026 16:19:10 +0800 Subject: [PATCH 04/18] chore: update styling, FAQ and url update --- Dockerfile | 2 +- docusaurus.config.js | 2 +- .../CustomAccordion/custom-accordion.scss | 2 +- src/components/Footer/index.tsx | 2 +- src/features/Home/GetStarted/GetStarted.tsx | 2 +- .../GetStarted/__tests__/GetStarted.test.tsx | 2 +- src/features/Home/HeroHeader/HeroHeader.tsx | 2 +- .../Updates/CTAFooter/CTAFooter.module.scss | 12 +++--- src/features/Updates/CTAFooter/CTAFooter.tsx | 4 +- src/features/Updates/FAQ/FAQ.tsx | 35 ++++++++++------- src/features/Updates/Hero/Hero.module.scss | 4 +- src/features/Updates/Hero/Hero.tsx | 10 ++--- .../HowToGetStarted.module.scss | 28 ++++++++++--- .../HowToGetStarted/HowToGetStarted.tsx | 19 +++++++-- .../ImportantNotice/ImportantNotice.tsx | 2 +- .../Updates/PageFooter/PageFooter.tsx | 5 +-- .../Updates/WhatsNew/WhatsNew.module.scss | 39 +++++++++++-------- src/features/Updates/WhatsNew/WhatsNew.tsx | 14 ------- .../update-app/AppUpdateForm/index.tsx | 2 +- 19 files changed, 106 insertions(+), 82 deletions(-) diff --git a/Dockerfile b/Dockerfile index 95011fd70..28012c07f 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,4 +1,4 @@ FROM nginx:alpine COPY ./build /usr/share/nginx/html -COPY ./developers.deriv.com.conf /etc/nginx/conf.d/default.conf +COPY ./developer.deriv.com.conf /etc/nginx/conf.d/default.conf RUN chown -R nginx:nginx /usr/share/nginx/html \ No newline at end of file diff --git a/docusaurus.config.js b/docusaurus.config.js index 30bf62782..22104d821 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -122,7 +122,7 @@ const config = { label: 'API explorer', }, { - to: 'https://developers.deriv.com', + to: 'https://developer.deriv.com', label: 'Documentation', position: 'left', className: 'external-nav-link', diff --git a/src/components/CustomAccordion/custom-accordion.scss b/src/components/CustomAccordion/custom-accordion.scss index efb3f747e..c2792df96 100644 --- a/src/components/CustomAccordion/custom-accordion.scss +++ b/src/components/CustomAccordion/custom-accordion.scss @@ -35,7 +35,7 @@ &__trigger { font-family: inherit; - padding: 24px 0px; + padding: 10px 0px; height: 42px; flex: 1; display: flex; diff --git a/src/components/Footer/index.tsx b/src/components/Footer/index.tsx index 27d176a90..659463d96 100644 --- a/src/components/Footer/index.tsx +++ b/src/components/Footer/index.tsx @@ -29,7 +29,7 @@ const Footer = () => { contact_us: get_url('contact-us'), dashboard: get_url('dashboard', false), api_explorer: get_url('api-explorer', false), - documentation: 'https://developers.deriv.com', + documentation: 'https://developer.deriv.com', }; }, [currentLocale]); diff --git a/src/features/Home/GetStarted/GetStarted.tsx b/src/features/Home/GetStarted/GetStarted.tsx index a5147aed0..c22f2b9c3 100644 --- a/src/features/Home/GetStarted/GetStarted.tsx +++ b/src/features/Home/GetStarted/GetStarted.tsx @@ -22,7 +22,7 @@ export const GetStarted = () => {
diff --git a/src/features/Updates/FAQ/FAQ.tsx b/src/features/Updates/FAQ/FAQ.tsx index b64de73df..00d40922f 100644 --- a/src/features/Updates/FAQ/FAQ.tsx +++ b/src/features/Updates/FAQ/FAQ.tsx @@ -9,8 +9,9 @@ const FAQ_ITEMS = [ content: (

- Yes. All existing apps and integrations on the legacy Deriv API will continue to function - as before. You do not need to migrate immediately. + Yes. Your existing applications, tokens, and integrations will continue to work on the + legacy Deriv APIs. Your current users and traders can keep using your apps as normal. + Nothing changes for them.

), @@ -20,8 +21,9 @@ const FAQ_ITEMS = [ content: (

- Yes, your existing apps can still authenticate users through the legacy platform. However, - new sign-ups on the new platform will require accounts created on developers.deriv.com. + No. New users and traders can only sign up through apps built on the new Deriv APIs. Your + legacy apps will continue serving your existing users, but to onboard new users you will + need to create a new application on developer.deriv.com.

), @@ -31,8 +33,8 @@ const FAQ_ITEMS = [ content: (

- Your current traders are not affected. They can continue using your app without any - changes. The migration only concerns developer accounts and API access. + Nothing changes for your current traders. They can continue using your apps on the legacy + Deriv APIs as they do today. The legacy APIs are not being shut down.

), @@ -42,9 +44,10 @@ const FAQ_ITEMS = [ content: (

- The legacy platform remains accessible, but we encourage new developers to start on the - new Deriv APIs at developers.deriv.com to take advantage of OAuth 2.0 and all the new - features. + Developer sign-ups on the legacy Deriv APIs will remain available until 30 April 2026. + After this date, all new accounts must be created on the new Deriv APIs at + developer.deriv.com. We recommend creating your account on the new Deriv APIs now to get + a head start.

), @@ -54,8 +57,9 @@ const FAQ_ITEMS = [ content: (

- Head to developers.deriv.com to create your account and explore the new APIs. The new - platform offers better documentation, AI tools, and a more secure authentication system. + Head straight to developer.deriv.com and create an account. The new Deriv APIs offer + OAuth 2.0 security, improved documentation, a playground to test your integrations, and + AI-powered tools to help you build faster.

), @@ -65,8 +69,9 @@ const FAQ_ITEMS = [ content: (

- This site has been updated to reflect that it is the legacy version of the Deriv API - documentation. The new platform is available at developers.deriv.com. + We've moved these APIs to legacy-api.deriv.com to clearly separate them from the new Deriv + APIs at developer.deriv.com. If you had api.deriv.com bookmarked, it now redirects here + automatically.

), @@ -76,8 +81,8 @@ const FAQ_ITEMS = [ content: (

- You can reach our support team through the Help centre at deriv.com/help-centre or contact - us directly at developers.deriv.com. + Reach out to us via live chat or WhatsApp. Our support team can help you with the + transition or any questions about the new Deriv APIs.

), diff --git a/src/features/Updates/Hero/Hero.module.scss b/src/features/Updates/Hero/Hero.module.scss index 18ee5b0bb..d46d9df97 100644 --- a/src/features/Updates/Hero/Hero.module.scss +++ b/src/features/Updates/Hero/Hero.module.scss @@ -39,7 +39,7 @@ color: rgba(255, 255, 255, 0.75); font-size: rem(1.8); line-height: 1.6; - max-width: rem(64); + max-width: rem(72); margin-bottom: rem(3.6); @include mobile { @@ -75,6 +75,7 @@ } } +/* .primaryBtn { border-radius: rem(10) !important; font-weight: 700 !important; @@ -84,3 +85,4 @@ border-radius: rem(10) !important; font-weight: 700 !important; } +*/ \ No newline at end of file diff --git a/src/features/Updates/Hero/Hero.tsx b/src/features/Updates/Hero/Hero.tsx index 2fb575d14..5b1c577fa 100644 --- a/src/features/Updates/Hero/Hero.tsx +++ b/src/features/Updates/Hero/Hero.tsx @@ -18,8 +18,9 @@ export const Hero = () => {

Far more secure, powered by OAuth 2.0, and a streamlined developer experience. - Here's everything you need to know about the transition. +
+ Create a new account on the new Deriv APIs to get started.

{PILLS.map((pill) => ( @@ -33,12 +34,9 @@ export const Hero = () => { variant='primary' color='coral' className={styles.primaryBtn} - onClick={() => window.open('https://developers.deriv.com', '_blank')} + onClick={() => window.open('https://developer.deriv.com', '_blank')} > - Create your new account → - -
diff --git a/src/features/Updates/HowToGetStarted/HowToGetStarted.module.scss b/src/features/Updates/HowToGetStarted/HowToGetStarted.module.scss index 0eb63d6d9..f3babc025 100644 --- a/src/features/Updates/HowToGetStarted/HowToGetStarted.module.scss +++ b/src/features/Updates/HowToGetStarted/HowToGetStarted.module.scss @@ -11,7 +11,7 @@ } .container { - max-width: rem(72); + max-width: rem(120); margin: 0 auto; } @@ -36,14 +36,20 @@ .stepsWrapper { display: flex; - flex-direction: column; - gap: rem(3.2); + flex-direction: row; + gap: rem(2.4); + + @include mobile { + flex-direction: column; + gap: rem(3.2); + } } .step { display: flex; + flex: 1; align-items: flex-start; - gap: rem(2.4); + gap: rem(1.6); } .stepNumber { @@ -68,15 +74,25 @@ } .stepTitle { - font-size: rem(1.8); + font-size: rem(1.6); font-weight: 700; color: #181c25; margin: 0; } .stepDescription { - font-size: rem(1.5); + font-size: rem(1.4); color: #5c6374; line-height: 1.6; margin: 0; } + +.link { + color: #ff444f !important; + font-weight: 600; + text-decoration: underline !important; + + &:hover { + color: #cc363f !important; + } +} diff --git a/src/features/Updates/HowToGetStarted/HowToGetStarted.tsx b/src/features/Updates/HowToGetStarted/HowToGetStarted.tsx index f22d95bca..3ee4df81e 100644 --- a/src/features/Updates/HowToGetStarted/HowToGetStarted.tsx +++ b/src/features/Updates/HowToGetStarted/HowToGetStarted.tsx @@ -1,18 +1,31 @@ import React from 'react'; +import Link from '@docusaurus/Link'; import Translate from '@docusaurus/Translate'; import styles from './HowToGetStarted.module.scss'; type TStep = { number: number; title: string; - description: string; + description: React.ReactNode; }; const STEPS: TStep[] = [ { number: 1, - title: 'Visit developers.deriv.com', - description: 'Go to developers.deriv.com to access the new Deriv APIs.', + title: 'Visit developer.deriv.com', + description: ( + + developer.deriv.com + + ), + }} + > + {'Go to {link} to access the new Deriv APIs.'} + + ), }, { number: 2, diff --git a/src/features/Updates/ImportantNotice/ImportantNotice.tsx b/src/features/Updates/ImportantNotice/ImportantNotice.tsx index 3c58a50c7..3bf0e5d2e 100644 --- a/src/features/Updates/ImportantNotice/ImportantNotice.tsx +++ b/src/features/Updates/ImportantNotice/ImportantNotice.tsx @@ -22,7 +22,7 @@ export const ImportantNotice = () => {

However, to access the new Deriv APIs, you will need to create a new account on - developers.deriv.com. Your existing legacy credentials will not work there. + developer.deriv.com. Your existing legacy credentials will not work there.

diff --git a/src/features/Updates/PageFooter/PageFooter.tsx b/src/features/Updates/PageFooter/PageFooter.tsx index 03b6b952c..561228bc2 100644 --- a/src/features/Updates/PageFooter/PageFooter.tsx +++ b/src/features/Updates/PageFooter/PageFooter.tsx @@ -7,7 +7,7 @@ export const PageFooter = () => { return (

- + New Deriv APIs | @@ -19,9 +19,6 @@ export const PageFooter = () => { Help centre
-

- © 2026 Deriv. All rights reserved. -

); }; diff --git a/src/features/Updates/WhatsNew/WhatsNew.module.scss b/src/features/Updates/WhatsNew/WhatsNew.module.scss index a464fab51..bf788b408 100644 --- a/src/features/Updates/WhatsNew/WhatsNew.module.scss +++ b/src/features/Updates/WhatsNew/WhatsNew.module.scss @@ -39,23 +39,36 @@ .cardGrid { display: grid; - grid-template-columns: 1fr 1fr; - gap: rem(2.4); + grid-template-columns: repeat(6, 1fr); + gap: rem(1.6); @include tablet { - grid-template-columns: 1fr; + grid-template-columns: repeat(3, 1fr); + } + + @include mobile { + grid-template-columns: repeat(2, 1fr); } } .card { background: #ffffff; border-radius: rem(1.2); - padding: rem(2.4); + padding: rem(2) rem(1.6); position: relative; display: flex; flex-direction: column; + align-items: center; + text-align: center; gap: rem(1.2); box-shadow: 0 rem(0.2) rem(0.8) rgba(0, 0, 0, 0.06); + transition: transform 0.2s ease, box-shadow 0.2s ease; + cursor: default; + + &:hover { + transform: translateY(-rem(0.4)); + box-shadow: 0 rem(0.8) rem(2.4) rgba(0, 0, 0, 0.12); + } } .iconWrapper { @@ -70,27 +83,21 @@ .badge { position: absolute; - top: rem(1.6); - right: rem(1.6); + top: rem(0.8); + right: rem(0.8); background: #2196f3; color: #ffffff; border-radius: rem(0.4); - padding: rem(0.3) rem(0.8); - font-size: rem(1); + padding: rem(0.2) rem(0.6); + font-size: rem(0.9); font-weight: 700; letter-spacing: 0.05em; } .cardTitle { - font-size: rem(1.6); + font-size: rem(1.3); font-weight: 700; color: #181c25; margin: 0; -} - -.cardDescription { - font-size: rem(1.4); - color: #5c6374; - line-height: 1.6; - margin: 0; + line-height: 1.4; } diff --git a/src/features/Updates/WhatsNew/WhatsNew.tsx b/src/features/Updates/WhatsNew/WhatsNew.tsx index 67f9dd223..7559db4b7 100644 --- a/src/features/Updates/WhatsNew/WhatsNew.tsx +++ b/src/features/Updates/WhatsNew/WhatsNew.tsx @@ -14,7 +14,6 @@ type TCard = { iconBg: string; icon: React.ReactNode; title: string; - description: string; comingSoon?: boolean; }; @@ -23,44 +22,32 @@ const CARDS: TCard[] = [ iconBg: '#ffeef0', icon: , title: 'OAuth 2.0 authentication', - description: - 'Industry-standard secure authentication that gives developers fine-grained access control and eliminates the need to share credentials.', }, { iconBg: '#f3eeff', icon: , title: 'AI-powered features', - description: - 'Built-in AI tools including an AI chatbot, LLMs.txt support, and MCP Server integration to supercharge your development workflow.', }, { iconBg: '#e8f4ff', icon: , title: 'Better documentation', - description: - 'Fully redesigned docs with interactive examples, clearer guides, and improved search to help you build faster.', }, { iconBg: '#eefff5', icon: , title: 'Your existing apps still work', - description: - 'All your current integrations continue to function on the legacy platform. No action required on your part.', }, { iconBg: '#e8f0ff', icon: , title: 'Analytics dashboard', - description: - 'Track API usage, monitor app performance, and gain insights into how users interact with your applications.', comingSoon: true, }, { iconBg: '#e8fff3', icon: , title: 'And much more', - description: - 'From improved rate limits to new endpoint capabilities, the new Deriv APIs are built for the next generation of developers.', }, ]; @@ -75,7 +62,6 @@ const FeatureCard = ({ card }: { card: TCard }) => ( )}
{card.title}
-

{card.description}

); diff --git a/src/features/dashboard/update-app/AppUpdateForm/index.tsx b/src/features/dashboard/update-app/AppUpdateForm/index.tsx index a21179e63..7f251f0c8 100644 --- a/src/features/dashboard/update-app/AppUpdateForm/index.tsx +++ b/src/features/dashboard/update-app/AppUpdateForm/index.tsx @@ -113,7 +113,7 @@ const AppUpdateForm = ({ initialValues, submit, onCancel, is_loading }: TAppForm {' '} . From 0847acb9d647f5825c2cc4f2c4b4e7a98ef1a561 Mon Sep 17 00:00:00 2001 From: muhammad-ahmed Date: Mon, 23 Feb 2026 16:27:33 +0800 Subject: [PATCH 05/18] chore: disable app registration and add tooltip --- .../__tests__/app-register.test.tsx | 19 ---- .../components/app-register/app-register.scss | 97 ------------------- .../components/app-register/app-register.tsx | 32 +++--- .../components/app-register/index.ts | 3 - .../components/app-register/types.ts | 49 ---------- .../components/apps-table/apps-table.tsx | 40 ++++---- 6 files changed, 41 insertions(+), 199 deletions(-) delete mode 100644 src/features/dashboard/components/app-register/__tests__/app-register.test.tsx delete mode 100644 src/features/dashboard/components/app-register/app-register.scss delete mode 100644 src/features/dashboard/components/app-register/index.ts delete mode 100644 src/features/dashboard/components/app-register/types.ts diff --git a/src/features/dashboard/components/app-register/__tests__/app-register.test.tsx b/src/features/dashboard/components/app-register/__tests__/app-register.test.tsx deleted file mode 100644 index c40144d86..000000000 --- a/src/features/dashboard/components/app-register/__tests__/app-register.test.tsx +++ /dev/null @@ -1,19 +0,0 @@ -import React from 'react'; -import { cleanup, render, screen } from '@site/src/test-utils'; -import AppRegister from '..'; - -const mock_submit = jest.fn(); - -describe('AppRegister', () => { - afterEach(() => { - cleanup(); - jest.clearAllMocks(); - }); - - it('Should render the register form with register button', () => { - render(); - - const button = screen.getByText(/Register now/i); - expect(button).toBeInTheDocument(); - }); -}); diff --git a/src/features/dashboard/components/app-register/app-register.scss b/src/features/dashboard/components/app-register/app-register.scss deleted file mode 100644 index c263f6411..000000000 --- a/src/features/dashboard/components/app-register/app-register.scss +++ /dev/null @@ -1,97 +0,0 @@ -@use '../../../../styles/mixins' as *; - -.app-register-container { - margin-top: 60px; - max-width: 608px; - &__input { - padding-block: 12px; - padding-inline-end: 12px; - padding-inline-start: 4px; - width: 90%; - border: none; - - &:focus-visible { - outline: none; - } - } - &_form { - display: flex; - justify-content: center; - } - - @include tablet { - margin-top: 48px; - } - - &__fields { - display: flex; - align-items: center; - border: 1px solid var(--opacity-black-100); - padding-block: 12px; - padding-inline: 12px; - border-radius: 8px; - - @include mobile { - padding-block: 4px; - } - - &.error-border { - border: 1px solid var(--colors-coral500); - } - - &__input { - width: 100%; - } - } - - &__restrictions { - color: var(--validation-text-light); - margin-top: 4px; - ul { - line-height: 24px; - padding-left: 32px; - li { - line-height: 18px; - font-size: 12px; - } - @include mobile { - padding: 0 16px 0 32px; - } - } - } - - &__tnc { - margin-top: 24px; - p { - color: var(--ifm-font-color-base); - } - &__label { - font-weight: 400; - font-size: 16px; - position: relative; - line-height: 24px; - @include tablet { - font-size: 14px; - top: -4px; - } - } - - &__link:hover { - color: var(--component-textIcon-normal-prominent); - } - } -} - -.error-border { - border: 1px solid var(--colors-coral500); -} - -.error { - color: var(--colors-coral500) !important; -} -.app-register-container__wrap-button { - display: flex; - justify-content: center; - gap: 16px; - margin-top: 3.5rem; -} diff --git a/src/features/dashboard/components/app-register/app-register.tsx b/src/features/dashboard/components/app-register/app-register.tsx index b01964cf5..1b7db3966 100644 --- a/src/features/dashboard/components/app-register/app-register.tsx +++ b/src/features/dashboard/components/app-register/app-register.tsx @@ -1,6 +1,7 @@ import React, { useCallback, useEffect, useState } from 'react'; import { useForm } from 'react-hook-form'; import Translate, { translate } from '@docusaurus/Translate'; +import CustomTooltip from '@site/src/components/CustomTooltip'; import { ApplicationObject } from '@deriv/api-types'; import { Button, Link, Text } from '@deriv-com/quill-ui'; import { yupResolver } from '@hookform/resolvers/yup'; @@ -75,7 +76,6 @@ const AppRegister: React.FC = () => { const { register, handleSubmit, - watch, formState: { errors }, } = useForm({ mode: 'all', @@ -84,10 +84,6 @@ const AppRegister: React.FC = () => { }); const has_error = Object.entries(errors).length !== 0; - const watchedValues = watch(); - const name_value = watchedValues.name || ''; - const tnc_approval = watchedValues.tnc_approval || false; - const is_button_disabled = has_error || !name_value || !tnc_approval; const { deviceType } = useDeviceType(); const is_desktop = deviceType === 'desktop'; @@ -168,15 +164,23 @@ const AppRegister: React.FC = () => { > Cancel - - + + + + + + diff --git a/src/features/dashboard/components/app-register/index.ts b/src/features/dashboard/components/app-register/index.ts deleted file mode 100644 index 8582f1b6f..000000000 --- a/src/features/dashboard/components/app-register/index.ts +++ /dev/null @@ -1,3 +0,0 @@ -import AppRegister from './app-register'; - -export default AppRegister; diff --git a/src/features/dashboard/components/app-register/types.ts b/src/features/dashboard/components/app-register/types.ts deleted file mode 100644 index c7a196065..000000000 --- a/src/features/dashboard/components/app-register/types.ts +++ /dev/null @@ -1,49 +0,0 @@ -import { translate } from '@docusaurus/Translate'; -import { UseFormRegisterReturn } from 'react-hook-form'; -import * as yup from 'yup'; - -export const app_name_error_map = { - error_code_1: translate({ - message: 'Only alphanumeric characters with spaces and underscores are allowed.', - }), - error_code_2: translate({ message: 'The name can contain up to 48 characters.' }), - error_code_3: translate({ - message: 'The name cannot contain “Binary”, “Deriv”, or similar words.', - }), -}; - -export const base_registration_schema = { - name: yup - .string() - .required(translate({ message: 'Enter your app name.' })) - .max(48, app_name_error_map.error_code_2) - .matches(/^(?=.*[a-zA-Z0-9])[a-zA-Z0-9_ ]*$/, { - message: app_name_error_map.error_code_1, - excludeEmptyString: true, - }) - .matches( - /^(?!.*deriv|.*d3r1v|.*der1v|.*d3riv|.*b1nary|.*binary|.*b1n4ry|.*bin4ry|.*blnary|.*b\|nary).*$/i, - { - message: app_name_error_map.error_code_3, - excludeEmptyString: true, - }, - ), - tnc_approval: yup - .boolean() - .oneOf([true], translate({ message: 'You must accept the terms and conditions.' })), -}; - -export type TTermsAndConditionsProps = { - register: UseFormRegisterReturn<'tnc_approval'>; - onChange?: (e: React.ChangeEvent) => void; -}; - -export const baseAppRegisterSchema = yup.object({ - ...base_registration_schema, -}); - -export type IBaseRegisterAppForm = yup.InferType; - -export type TRestrictionsComponentProps = { - error: string; -}; diff --git a/src/features/dashboard/components/apps-table/apps-table.tsx b/src/features/dashboard/components/apps-table/apps-table.tsx index c5bd09a1f..4925a5182 100644 --- a/src/features/dashboard/components/apps-table/apps-table.tsx +++ b/src/features/dashboard/components/apps-table/apps-table.tsx @@ -15,6 +15,7 @@ import { import { TDashboardTab } from '@site/src/contexts/app-manager/app-manager.context'; import useAppManager from '@site/src/hooks/useAppManager'; import useDeviceType from '@site/src/hooks/useDeviceType'; +import CustomTooltip from '@site/src/components/CustomTooltip'; import Table from '../common-table'; import DeleteAppDialog from '../dialogs/delete-app-dialog'; import AppsTableOptionDialog, { @@ -117,8 +118,7 @@ const AppsTableOptions: React.FC = ({ const AppsTableHeader: React.FC<{ is_desktop: boolean; - updateCurrentTab: (tab: TDashboardTab) => void; -}> = ({ is_desktop, updateCurrentTab }) => { +}> = ({ is_desktop }) => { return (
- - + ); }; @@ -411,7 +417,7 @@ const AppsTable = ({ apps }: AppsTableProps) => { })} > {isDeleteOpen && } - + From 41e929971785ff332f62493cb9e7ab3f0aeac529 Mon Sep 17 00:00:00 2001 From: muhammad-ahmed Date: Mon, 23 Feb 2026 16:33:46 +0800 Subject: [PATCH 06/18] chore: update FAQs --- src/features/Updates/FAQ/FAQ.tsx | 40 ++------ .../components/app-register/app-register.scss | 97 +++++++++++++++++++ .../components/app-register/index.ts | 3 + .../components/app-register/types.ts | 49 ++++++++++ 4 files changed, 157 insertions(+), 32 deletions(-) create mode 100644 src/features/dashboard/components/app-register/app-register.scss create mode 100644 src/features/dashboard/components/app-register/index.ts create mode 100644 src/features/dashboard/components/app-register/types.ts diff --git a/src/features/Updates/FAQ/FAQ.tsx b/src/features/Updates/FAQ/FAQ.tsx index 00d40922f..9a9895080 100644 --- a/src/features/Updates/FAQ/FAQ.tsx +++ b/src/features/Updates/FAQ/FAQ.tsx @@ -10,8 +10,8 @@ const FAQ_ITEMS = [

Yes. Your existing applications, tokens, and integrations will continue to work on the - legacy Deriv APIs. Your current users and traders can keep using your apps as normal. - Nothing changes for them. + legacy Deriv APIs. Your current users can keep using your apps as normal. Nothing changes + for them.

), @@ -21,9 +21,9 @@ const FAQ_ITEMS = [ content: (

- No. New users and traders can only sign up through apps built on the new Deriv APIs. Your - legacy apps will continue serving your existing users, but to onboard new users you will - need to create a new application on developer.deriv.com. + No. New users can only sign up through apps built on the new Deriv APIs. Your legacy apps + will continue serving your existing users, but to onboard new users, you will need to + create a new application on developers.deriv.com.

), @@ -34,20 +34,7 @@ const FAQ_ITEMS = [

Nothing changes for your current traders. They can continue using your apps on the legacy - Deriv APIs as they do today. The legacy APIs are not being shut down. - -

- ), - }, - { - header: 'Can I still sign up on the legacy Deriv APIs?', - content: ( -

- - Developer sign-ups on the legacy Deriv APIs will remain available until 30 April 2026. - After this date, all new accounts must be created on the new Deriv APIs at - developer.deriv.com. We recommend creating your account on the new Deriv APIs now to get - a head start. + Deriv APIs as they do today.

), @@ -57,9 +44,9 @@ const FAQ_ITEMS = [ content: (

- Head straight to developer.deriv.com and create an account. The new Deriv APIs offer + Head straight to developers.deriv.com and create an account. The new Deriv APIs offer OAuth 2.0 security, improved documentation, a playground to test your integrations, and - AI-powered tools to help you build faster. + AI-powered tools to help you build faster. (edited)

), @@ -76,17 +63,6 @@ const FAQ_ITEMS = [

), }, - { - header: 'How do I get help?', - content: ( -

- - Reach out to us via live chat or WhatsApp. Our support team can help you with the - transition or any questions about the new Deriv APIs. - -

- ), - }, ]; export const FAQ = () => { diff --git a/src/features/dashboard/components/app-register/app-register.scss b/src/features/dashboard/components/app-register/app-register.scss new file mode 100644 index 000000000..c263f6411 --- /dev/null +++ b/src/features/dashboard/components/app-register/app-register.scss @@ -0,0 +1,97 @@ +@use '../../../../styles/mixins' as *; + +.app-register-container { + margin-top: 60px; + max-width: 608px; + &__input { + padding-block: 12px; + padding-inline-end: 12px; + padding-inline-start: 4px; + width: 90%; + border: none; + + &:focus-visible { + outline: none; + } + } + &_form { + display: flex; + justify-content: center; + } + + @include tablet { + margin-top: 48px; + } + + &__fields { + display: flex; + align-items: center; + border: 1px solid var(--opacity-black-100); + padding-block: 12px; + padding-inline: 12px; + border-radius: 8px; + + @include mobile { + padding-block: 4px; + } + + &.error-border { + border: 1px solid var(--colors-coral500); + } + + &__input { + width: 100%; + } + } + + &__restrictions { + color: var(--validation-text-light); + margin-top: 4px; + ul { + line-height: 24px; + padding-left: 32px; + li { + line-height: 18px; + font-size: 12px; + } + @include mobile { + padding: 0 16px 0 32px; + } + } + } + + &__tnc { + margin-top: 24px; + p { + color: var(--ifm-font-color-base); + } + &__label { + font-weight: 400; + font-size: 16px; + position: relative; + line-height: 24px; + @include tablet { + font-size: 14px; + top: -4px; + } + } + + &__link:hover { + color: var(--component-textIcon-normal-prominent); + } + } +} + +.error-border { + border: 1px solid var(--colors-coral500); +} + +.error { + color: var(--colors-coral500) !important; +} +.app-register-container__wrap-button { + display: flex; + justify-content: center; + gap: 16px; + margin-top: 3.5rem; +} diff --git a/src/features/dashboard/components/app-register/index.ts b/src/features/dashboard/components/app-register/index.ts new file mode 100644 index 000000000..8582f1b6f --- /dev/null +++ b/src/features/dashboard/components/app-register/index.ts @@ -0,0 +1,3 @@ +import AppRegister from './app-register'; + +export default AppRegister; diff --git a/src/features/dashboard/components/app-register/types.ts b/src/features/dashboard/components/app-register/types.ts new file mode 100644 index 000000000..a94245bfc --- /dev/null +++ b/src/features/dashboard/components/app-register/types.ts @@ -0,0 +1,49 @@ +import { translate } from '@docusaurus/Translate'; +import { UseFormRegisterReturn } from 'react-hook-form'; +import * as yup from 'yup'; + +export const app_name_error_map = { + error_code_1: translate({ + message: 'Only alphanumeric characters with spaces and underscores are allowed.', + }), + error_code_2: translate({ message: 'The name can contain up to 48 characters.' }), + error_code_3: translate({ + message: 'The name cannot contain "Binary", "Deriv", or similar words.', + }), +}; + +export const base_registration_schema = { + name: yup + .string() + .required(translate({ message: 'Enter your app name.' })) + .max(48, app_name_error_map.error_code_2) + .matches(/^(?=.*[a-zA-Z0-9])[a-zA-Z0-9_ ]*$/, { + message: app_name_error_map.error_code_1, + excludeEmptyString: true, + }) + .matches( + /^(?!.*deriv|.*d3r1v|.*der1v|.*d3riv|.*b1nary|.*binary|.*b1n4ry|.*bin4ry|.*blnary|.*b\|nary).*$/i, + { + message: app_name_error_map.error_code_3, + excludeEmptyString: true, + }, + ), + tnc_approval: yup + .boolean() + .oneOf([true], translate({ message: 'You must accept the terms and conditions.' })), +}; + +export type TTermsAndConditionsProps = { + register: UseFormRegisterReturn<'tnc_approval'>; + onChange?: (e: React.ChangeEvent) => void; +}; + +export const baseAppRegisterSchema = yup.object({ + ...base_registration_schema, +}); + +export type IBaseRegisterAppForm = yup.InferType; + +export type TRestrictionsComponentProps = { + error: string; +}; From 1fcfeda49db485ac3c3e593d9747c56431351213 Mon Sep 17 00:00:00 2001 From: muhammad-ahmed Date: Mon, 23 Feb 2026 16:42:31 +0800 Subject: [PATCH 07/18] chore: legacy banner sticky --- src/theme/Layout/index.tsx | 6 ++++-- src/theme/Layout/styles.module.css | 6 ++++++ 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/src/theme/Layout/index.tsx b/src/theme/Layout/index.tsx index 2a16d77f0..c9c9f80e0 100644 --- a/src/theme/Layout/index.tsx +++ b/src/theme/Layout/index.tsx @@ -34,8 +34,10 @@ export default function Layout(props: Props): JSX.Element { - - +
+ + +
Date: Mon, 23 Feb 2026 17:40:27 +0800 Subject: [PATCH 08/18] chore: update redirection URL --- src/components/Footer/index.tsx | 2 +- src/features/Home/GetStarted/GetStarted.tsx | 2 +- src/features/Home/GetStarted/__tests__/GetStarted.test.tsx | 2 +- src/features/Home/HeroHeader/HeroHeader.tsx | 2 +- src/features/Updates/CTAFooter/CTAFooter.tsx | 4 ++-- src/features/Updates/FAQ/FAQ.tsx | 6 +++--- src/features/Updates/Hero/Hero.tsx | 2 +- src/features/Updates/HowToGetStarted/HowToGetStarted.tsx | 6 +++--- src/features/Updates/ImportantNotice/ImportantNotice.tsx | 2 +- src/features/Updates/PageFooter/PageFooter.tsx | 2 +- .../dashboard/components/app-register/app-register.tsx | 2 +- src/features/dashboard/components/apps-table/apps-table.tsx | 2 +- src/features/dashboard/update-app/AppUpdateForm/index.tsx | 2 +- 13 files changed, 18 insertions(+), 18 deletions(-) diff --git a/src/components/Footer/index.tsx b/src/components/Footer/index.tsx index 659463d96..ab978080e 100644 --- a/src/components/Footer/index.tsx +++ b/src/components/Footer/index.tsx @@ -29,7 +29,7 @@ const Footer = () => { contact_us: get_url('contact-us'), dashboard: get_url('dashboard', false), api_explorer: get_url('api-explorer', false), - documentation: 'https://developer.deriv.com', + documentation: 'https://legacy-doc.deriv.com', }; }, [currentLocale]); diff --git a/src/features/Home/GetStarted/GetStarted.tsx b/src/features/Home/GetStarted/GetStarted.tsx index c22f2b9c3..dc04f0d60 100644 --- a/src/features/Home/GetStarted/GetStarted.tsx +++ b/src/features/Home/GetStarted/GetStarted.tsx @@ -22,7 +22,7 @@ export const GetStarted = () => {
diff --git a/src/features/Updates/FAQ/FAQ.tsx b/src/features/Updates/FAQ/FAQ.tsx index 9a9895080..9e850d510 100644 --- a/src/features/Updates/FAQ/FAQ.tsx +++ b/src/features/Updates/FAQ/FAQ.tsx @@ -23,7 +23,7 @@ const FAQ_ITEMS = [ No. New users can only sign up through apps built on the new Deriv APIs. Your legacy apps will continue serving your existing users, but to onboard new users, you will need to - create a new application on developers.deriv.com. + create a new application on beta-api.deriv.com.

), @@ -44,7 +44,7 @@ const FAQ_ITEMS = [ content: (

- Head straight to developers.deriv.com and create an account. The new Deriv APIs offer + Head straight to beta-api.deriv.com and create an account. The new Deriv APIs offer OAuth 2.0 security, improved documentation, a playground to test your integrations, and AI-powered tools to help you build faster. (edited) @@ -57,7 +57,7 @@ const FAQ_ITEMS = [

We've moved these APIs to legacy-api.deriv.com to clearly separate them from the new Deriv - APIs at developer.deriv.com. If you had api.deriv.com bookmarked, it now redirects here + APIs at beta-api.deriv.com. If you had api.deriv.com bookmarked, it now redirects here automatically.

diff --git a/src/features/Updates/Hero/Hero.tsx b/src/features/Updates/Hero/Hero.tsx index 5b1c577fa..0f83cacc5 100644 --- a/src/features/Updates/Hero/Hero.tsx +++ b/src/features/Updates/Hero/Hero.tsx @@ -34,7 +34,7 @@ export const Hero = () => { variant='primary' color='coral' className={styles.primaryBtn} - onClick={() => window.open('https://developer.deriv.com', '_blank')} + onClick={() => window.open('https://beta-api.deriv.com', '_blank')} > Go to new Deriv APIs → diff --git a/src/features/Updates/HowToGetStarted/HowToGetStarted.tsx b/src/features/Updates/HowToGetStarted/HowToGetStarted.tsx index 3ee4df81e..73865aa78 100644 --- a/src/features/Updates/HowToGetStarted/HowToGetStarted.tsx +++ b/src/features/Updates/HowToGetStarted/HowToGetStarted.tsx @@ -12,13 +12,13 @@ type TStep = { const STEPS: TStep[] = [ { number: 1, - title: 'Visit developer.deriv.com', + title: 'Visit beta-api.deriv.com', description: ( - developer.deriv.com + + beta-api.deriv.com ), }} diff --git a/src/features/Updates/ImportantNotice/ImportantNotice.tsx b/src/features/Updates/ImportantNotice/ImportantNotice.tsx index 3bf0e5d2e..cd8ac8189 100644 --- a/src/features/Updates/ImportantNotice/ImportantNotice.tsx +++ b/src/features/Updates/ImportantNotice/ImportantNotice.tsx @@ -22,7 +22,7 @@ export const ImportantNotice = () => {

However, to access the new Deriv APIs, you will need to create a new account on - developer.deriv.com. Your existing legacy credentials will not work there. + beta-api.deriv.com. Your existing legacy credentials will not work there.

diff --git a/src/features/Updates/PageFooter/PageFooter.tsx b/src/features/Updates/PageFooter/PageFooter.tsx index 561228bc2..3271da71c 100644 --- a/src/features/Updates/PageFooter/PageFooter.tsx +++ b/src/features/Updates/PageFooter/PageFooter.tsx @@ -7,7 +7,7 @@ export const PageFooter = () => { return (