Skip to content

Commit eaa679e

Browse files
jeff-matthewsjeff-matthews
committed
CCSAAS-2663: initial commit of get credential stub files
1 parent 63dc33a commit eaa679e

File tree

2 files changed

+188
-1
lines changed

2 files changed

+188
-1
lines changed

‎src/pages/credential/GetCredentialOAuthS2s.js

Lines changed: 183 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,183 @@
1+
import React from 'react'
2+
import { GetCredential } from '@adobe/gatsby-theme-aio/src/components/GetCredential';
3+
import commerce from "./images/commerce.svg";
4+
5+
const GetCredentialOAuthS2s = () => {
6+
7+
return (
8+
9+
<GetCredential className="getCredentialContainer" templateId="1234567890" productName='Adobe Commerce as a Cloud Service' >
10+
11+
<GetCredential.SignIn title="Get credentials" paragraph="After signing in, you can create credentials that can be used to call the Commerce APIs." buttonText="Sign in" />
12+
13+
<GetCredential.Form title="Get credentials" paragraph="Create credentials that you can use to call the Commerce APIs." className="formClass">
14+
15+
<GetCredential.Form.CredentialName label="Credential name" description="The credential name must be unique, use alphanumeric characters, and between 6 and 45 characters long. A project will be automatically created with the same name in Adobe Developer Console." range="45" />
16+
17+
<GetCredential.Form.Products label="Included products and services">
18+
<GetCredential.Form.Product label="Adobe Commerce as a Cloud Service" icon={commerce} />
19+
</GetCredential.Form.Products>
20+
21+
<GetCredential.Form.AdobeDeveloperConsole label='By checking this box, you agree to' linkText="Adobe Developer Terms of Use" href="https://wwwimages2.adobe.com/content/dam/cc/en/legal/servicetou/Adobe-Developer-Additional-Terms_en-US_20230822.pdf" />
22+
23+
<GetCredential.Form.Side>
24+
<div style={{ display: "flex", gap: "32px", flexDirection: "column" }}>
25+
<div style={{ display: "flex", gap: "16px", flexDirection: "column" }}>
26+
<h3 className="spectrum-Heading spectrum-Heading--sizeS side-header">
27+
OAuth server-to-server credential
28+
</h3>
29+
<p className="spectrum-Body spectrum-Body--sizeM">
30+
This credential allows you to use industry standard OAuth2.0 libraries to generate access tokens using the OAuth 2.0 client credentials grant type.
31+
</p>
32+
</div>
33+
<div style={{ display: "flex", gap: "16px", flexDirection: "column" }}>
34+
<h3 className="spectrum-Heading spectrum-Heading--sizeS side-header">
35+
Learn more
36+
</h3>
37+
<a style={{ color: "#0265DC" }} href="https://developer.adobe.com/commerce/webapi/rest/authentication/">
38+
Authentication documentation
39+
</a>
40+
</div>
41+
</div>
42+
</GetCredential.Form.Side>
43+
44+
</GetCredential.Form>
45+
46+
<GetCredential.UnknownError helpLink="https://some_help_link" helpLinkText="Get Help" className="unKnownError" />
47+
48+
<GetCredential.Card title="Your credential is ready to use" developerConsoleManage="Manage on Developer Console" className="card_developer_console" devConsoleDirection="/console" isCollapsable="true">
49+
50+
<GetCredential.Card.Side>
51+
<div style={{ display: "flex", gap: "32px", flexDirection: "column" }}>
52+
<div style={{ display: "flex", gap: "16px", flexDirection: "column" }}>
53+
<h3 className="spectrum-Heading spectrum-Heading--sizeS side-header">
54+
OAuth server-to-server credential
55+
</h3>
56+
<p className="spectrum-Body spectrum-Body--sizeM">
57+
This credential allows you to use industry standard OAuth2.0 libraries to generate access tokens using the OAuth 2.0 client credentials grant type.
58+
</p>
59+
</div>
60+
<div style={{ display: "flex", gap: "16px", flexDirection: "column" }}>
61+
<h3 className="spectrum-Heading spectrum-Heading--sizeS side-header">
62+
Learn more
63+
</h3>
64+
<a style={{ color: "#0265DC" }} href="https://experienceleague.adobe.com/en/docs/experience-platform/landing/platform-apis/api-authentication">
65+
Authentication documentation
66+
</a>
67+
<a style={{ color: "#0265DC" }} href="https://experienceleague.adobe.com/en/docs/experience-platform/landing/platform-apis/api-guide">
68+
Adobe Experience Platform API documentation
69+
</a>
70+
<a style={{ color: "#0265DC" }} href="https://experienceleague.adobe.com/en/docs/experience-platform">
71+
Adobe Experience Platform documentation
72+
</a>
73+
</div>
74+
</div>
75+
</GetCredential.Card.Side>
76+
77+
<GetCredential.Card.Products label="Included products and services">
78+
<GetCredential.Card.Product label="Adobe Commerce as a Cloud Service" icon={commerce} />
79+
</GetCredential.Card.Products>
80+
81+
<GetCredential.Card.ProjectsDropdown label="Projects" subHeading="Only your projects that contain credentials are shown" />
82+
83+
<GetCredential.Card.ManageDeveloperConsole label="Manage all your projects and credentials on Adobe Developer Console" direction='/console' />
84+
85+
<GetCredential.Card.DevConsoleLink heading="Developer Console Project" />
86+
87+
<GetCredential.Card.AccessToken helpText="" buttonLabel="Generate and copy token" heading={(<>Access token<br/><br/> <span style="font-weight:normal"><small>After copying the access token, you must prepend the token with <code>Bearer</code> to use it with API calls.</small></span></>)} />
88+
89+
90+
<GetCredential.Card.CredentialDetails heading={(<>Credential details<br/><br/> <span style="font-weight:normal"><small>You can use the following credential details to try out the Adobe Commerce as a Cloud Service REST API below.<ul><li>Client ID: Your public identifier for accessing the API. This acts as an API key when used with the Commerce APIs, and corresponds with the <code>x-api-key</code> header.</li><li>Organization ID: The ID of the organization you're using with the Commerce APIs. This corresponds with the <code>x-gw-ims-org-id</code> header.</li></ul></small></span></>)} orderBy="ClientId,ImsOrgID">
91+
<GetCredential.Card.CredentialDetails.ClientId heading="Client ID (x-api-key)" />
92+
<GetCredential.Card.CredentialDetails.ImsOrgID heading="Organization ID" />
93+
<GetCredential.Card.CredentialDetails.Scopes heading="Scopes" scope="openid,session,AdobeID,read_organizations,additional_info.projectedProductContext" />
94+
</GetCredential.Card.CredentialDetails>
95+
96+
</GetCredential.Card>
97+
98+
<GetCredential.Return title="Previously created projects" paragraph="Select a project and access your existing credentials for Adobe Commerce as a Cloud Service." className="card_developer_console" isCollapsable="true">
99+
100+
<GetCredential.Return.Side>
101+
<GetCredential.Return.Side.Custom>
102+
<div style={{ display: "flex", gap: "30px", flexDirection: "column", width: "100%" }}>
103+
<h3 className='spectrum-Heading spectrum-Heading--sizeM'>Welcome back</h3>
104+
<p className="spectrum-Body spectrum-Body--sizeM">You can either re-use an existing credential or create a new credential.</p>
105+
</div>
106+
</GetCredential.Return.Side.Custom>
107+
<GetCredential.Return.Side.NewCredential heading="Need another credential?" buttonLabel="Create new credential" />
108+
</GetCredential.Return.Side>
109+
110+
<GetCredential.Return.CredentialDetails heading={(<>Credential details<br/><br/> <span style="font-weight:normal"><small>You can use the following credential details to try out the Adobe Commerce as a Cloud Service REST API below.<ul><li>Client ID: Your public identifier for accessing the API. This acts as an API key when used with the Platform APIs, and corresponds with the <code>x-api-key</code> header.</li><li>Organization ID: The ID of the organization you're using with the Commerce APIs. This corresponds with the <code>x-gw-ims-org-id</code> header.</li></ul></small></span></>)} orderBy="ClientId,ImsOrgID">
111+
<GetCredential.Return.CredentialDetails.ClientId heading="Client ID (x-api-key)" />
112+
<GetCredential.Return.CredentialDetails.ImsOrgID heading="Organization ID" />
113+
<GetCredential.Return.CredentialDetails.Scopes heading="Scopes" scope="openid,session,AdobeID,read_organizations,additional_info.projectedProductContext" />
114+
</GetCredential.Return.CredentialDetails>
115+
116+
<GetCredential.Return.ProjectsDropdown label="Projects" subHeading="Only your projects that contain credentials are shown" />
117+
118+
<GetCredential.Return.ManageDeveloperConsole label="Manage all your projects and credentials on Adobe Developer Console" direction='/console/projects' />
119+
120+
<GetCredential.Return.AccessToken helpText="" buttonLabel="Generate and copy token" heading={(<>Access token<br/><br/> <span style="font-weight:normal"><small>After copying the access token, you must prepend the token with <code>Bearer</code> to use it with API calls.</small></span></>)} />
121+
122+
<GetCredential.Return.DevConsoleLink heading="Developer Console project" />
123+
124+
<GetCredential.Return.Products label="Included products and services">
125+
<GetCredential.Return.Product label="Adobe Commerce as a Cloud Service" icon={commerce} />
126+
</GetCredential.Return.Products>
127+
128+
</GetCredential.Return>
129+
130+
<GetCredential.RequestAccess
131+
title="Get credentials"
132+
paragraph="Create unique credentials that you will use to call multiple APIs from your application."
133+
>
134+
<GetCredential.RequestAccess.EdgeCase>
135+
<GetCredential.RequestAccess.EdgeCase.NoProduct title="Your organization does not have access to Adobe Commerce as a Cloud Service." />
136+
<GetCredential.RequestAccess.EdgeCase.Type1User title="You do not have access to Adobe Commerce as a Cloud Service. Please use another organization and try again." />
137+
<GetCredential.RequestAccess.EdgeCase.NotMember title="You do not have access to Adobe Commerce as a Cloud Service. Please use another organization and try again." />
138+
</GetCredential.RequestAccess.EdgeCase>
139+
140+
<GetCredential.RequestAccess.RestrictedAccess
141+
title="Restricted Access"
142+
buttonLabel="Request access"
143+
>
144+
<GetCredential.RequestAccess.RestrictedAccess.Products label="Included products and services">
145+
<GetCredential.RequestAccess.RestrictedAccess.Products.Product
146+
icon={commerce}
147+
label="Adobe Commerce as a Cloud Service"
148+
/>
149+
</GetCredential.RequestAccess.RestrictedAccess.Products>
150+
</GetCredential.RequestAccess.RestrictedAccess>
151+
<GetCredential.RequestAccess.RequestAccessSide>
152+
<div style={{ display: "flex", gap: "32px", flexDirection: "column" }}>
153+
<div style={{ display: "flex", gap: "16px", flexDirection: "column" }}>
154+
<h3 className="spectrum-Heading spectrum-Heading--sizeS side-header">
155+
OAuth server-to-server credential
156+
</h3>
157+
<p className="spectrum-Body spectrum-Body--sizeM">
158+
This credential allows you to use industry standard OAuth2.0 libraries to generate access tokens using the OAuth 2.0 client credentials grant type.
159+
</p>
160+
</div>
161+
<div style={{ display: "flex", gap: "16px", flexDirection: "column" }}>
162+
<h3 className="spectrum-Heading spectrum-Heading--sizeS side-header">
163+
Learn more
164+
</h3>
165+
<a style={{ color: "#0265DC" }} href="https://experienceleague.adobe.com/en/docs/experience-platform/landing/platform-apis/api-authentication">
166+
Authentication documentation
167+
</a>
168+
<a style={{ color: "#0265DC" }} href="https://experienceleague.adobe.com/en/docs/experience-platform/landing/platform-apis/api-guide">
169+
Adobe Experience Platform API documentation
170+
</a>
171+
<a style={{ color: "#0265DC" }} href="https://experienceleague.adobe.com/en/docs/experience-platform">
172+
Adobe Experience Platform documentation
173+
</a>
174+
</div>
175+
</div>
176+
</GetCredential.RequestAccess.RequestAccessSide>
177+
</GetCredential.RequestAccess>
178+
</GetCredential>
179+
180+
)
181+
}
182+
183+
export default GetCredentialOAuthS2s;

‎src/pages/reference/rest/saas.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@ keywords:
55
- REST
66
edition: saas
77
frameSrc: https://adobe-commerce-saas.redoc.ly
8-
---
8+
---
9+
10+
import GetCredentialsOAuthS2s from '/src/pages/credential/GetCredentialOAuthS2s.js'
911

1012
# REST endpoints for Adobe Commerce as a Cloud Service
13+
14+
<GetCredentialOAuthS2s />

0 commit comments

Comments
 (0)