From 5e1496efa6969d773a7ee830868817c68a42f9f6 Mon Sep 17 00:00:00 2001
From: Cameron Koegel <ckoegel@bandwidth.com>
Date: Fri, 9 Sep 2022 11:31:54 -0400
Subject: [PATCH] more className additions

---
 src/components/CallbackSamples/CallbackSamples.tsx         | 2 +-
 src/components/Fields/Extensions.tsx                       | 2 +-
 src/components/Operation/Operation.tsx                     | 3 +--
 src/components/Parameters/Parameters.tsx                   | 4 +++-
 src/components/RequestSamples/RequestSamples.tsx           | 4 ++--
 src/components/ResponseSamples/ResponseSamples.tsx         | 4 ++--
 src/components/Schema/ArraySchema.tsx                      | 2 +-
 src/components/Schema/ObjectSchema.tsx                     | 2 +-
 src/components/Schema/OneOfSchema.tsx                      | 2 +-
 src/components/Schema/RecursiveSchema.tsx                  | 2 +-
 src/components/Schema/Schema.tsx                           | 2 +-
 src/components/SecurityRequirement/SecurityRequirement.tsx | 2 +-
 src/components/SourceCode/SourceCode.tsx                   | 2 +-
 13 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/src/components/CallbackSamples/CallbackSamples.tsx b/src/components/CallbackSamples/CallbackSamples.tsx
index 60bdf5a6..2279f0a8 100644
--- a/src/components/CallbackSamples/CallbackSamples.tsx
+++ b/src/components/CallbackSamples/CallbackSamples.tsx
@@ -56,7 +56,7 @@ export class CallbackSamples extends React.Component<CallbackSamplesProps> {
     });
 
     return (
-      <div>
+      <div className="operation-callback-samples">
         <RightPanelHeader> Callback payload samples </RightPanelHeader>
 
         <SamplesWrapper>
diff --git a/src/components/Fields/Extensions.tsx b/src/components/Fields/Extensions.tsx
index 5a450ce4..887adfec 100644
--- a/src/components/Fields/Extensions.tsx
+++ b/src/components/Fields/Extensions.tsx
@@ -27,7 +27,7 @@ export class Extensions extends React.PureComponent<ExtensionsProps> {
           <>
             {options.showExtensions &&
               Object.keys(exts).map(key => (
-                <Extension key={key}>
+                <Extension key={key} className="operation-extension">
                   <FieldLabel> {key.substring(2)}: </FieldLabel>{' '}
                   <ExtensionValue>
                     {typeof exts[key] === 'string' ? exts[key] : JSON.stringify(exts[key])}
diff --git a/src/components/Operation/Operation.tsx b/src/components/Operation/Operation.tsx
index c8031914..2464658e 100644
--- a/src/components/Operation/Operation.tsx
+++ b/src/components/Operation/Operation.tsx
@@ -55,8 +55,7 @@ export const Operation = observer(({ operation }: OperationProps): JSX.Element =
                 {externalDocs && <ExternalDocumentation externalDocs={externalDocs} />}
               </Description>
             )}
-            <Extensions extensions={operation.extensions} />{' '}
-            {/*TODO: className="operation-extensions"*/}
+            <Extensions extensions={operation.extensions} />
             <SecurityRequirements securities={operation.security} />
             <Parameters parameters={operation.parameters} body={operation.requestBody} />
             <ResponsesList responses={operation.responses} />
diff --git a/src/components/Parameters/Parameters.tsx b/src/components/Parameters/Parameters.tsx
index 3f4275df..099fbb6c 100644
--- a/src/components/Parameters/Parameters.tsx
+++ b/src/components/Parameters/Parameters.tsx
@@ -79,7 +79,9 @@ export function BodyContent(props: {
       {({ schema }) => {
         return (
           <>
-            {description !== undefined && <Markdown source={description} />}
+            {description !== undefined && (
+              <Markdown source={description} className="request-body-description" />
+            )}
             {schema?.type === 'object' && (
               <ConstraintsView constraints={schema?.constraints || []} />
             )}
diff --git a/src/components/RequestSamples/RequestSamples.tsx b/src/components/RequestSamples/RequestSamples.tsx
index 7a06d89f..7588ab5b 100644
--- a/src/components/RequestSamples/RequestSamples.tsx
+++ b/src/components/RequestSamples/RequestSamples.tsx
@@ -26,7 +26,7 @@ export class RequestSamples extends React.Component<RequestSamplesProps> {
     const hideTabList = samples.length === 1 ? this.context.hideSingleRequestSampleTab : false;
     return (
       (hasSamples && (
-        <div>
+        <div className="operation-request-samples">
           <RightPanelHeader> {l('requestSamples')} </RightPanelHeader>
 
           <Tabs defaultIndex={0}>
@@ -40,7 +40,7 @@ export class RequestSamples extends React.Component<RequestSamplesProps> {
             {samples.map(sample => (
               <TabPanel key={sample.lang + '_' + (sample.label || '')}>
                 {isPayloadSample(sample) ? (
-                  <div>
+                  <div className="request-payload">
                     <PayloadSamples content={sample.requestBodyContent} />
                   </div>
                 ) : (
diff --git a/src/components/ResponseSamples/ResponseSamples.tsx b/src/components/ResponseSamples/ResponseSamples.tsx
index 72384fe5..2f703c65 100644
--- a/src/components/ResponseSamples/ResponseSamples.tsx
+++ b/src/components/ResponseSamples/ResponseSamples.tsx
@@ -23,7 +23,7 @@ export class ResponseSamples extends React.Component<ResponseSamplesProps> {
 
     return (
       (responses.length > 0 && (
-        <div>
+        <div className="operation-response-samples">
           <RightPanelHeader> {l('responseSamples')} </RightPanelHeader>
 
           <Tabs defaultIndex={0}>
@@ -36,7 +36,7 @@ export class ResponseSamples extends React.Component<ResponseSamplesProps> {
             </TabList>
             {responses.map(response => (
               <TabPanel key={response.code}>
-                <div>
+                <div className="response-sample">
                   <PayloadSamples content={response.content!} />
                 </div>
               </TabPanel>
diff --git a/src/components/Schema/ArraySchema.tsx b/src/components/Schema/ArraySchema.tsx
index 84bd716a..2fce3e97 100644
--- a/src/components/Schema/ArraySchema.tsx
+++ b/src/components/Schema/ArraySchema.tsx
@@ -34,7 +34,7 @@ export class ArraySchema extends React.PureComponent<SchemaProps> {
     }
 
     return (
-      <div>
+      <div className="array-schema">
         <ArrayOpenningLabel> Array {minMaxItems}</ArrayOpenningLabel>
         <PaddedSchema>
           <Schema {...this.props} schema={itemsSchema} />
diff --git a/src/components/Schema/ObjectSchema.tsx b/src/components/Schema/ObjectSchema.tsx
index 145ea98d..686d113b 100644
--- a/src/components/Schema/ObjectSchema.tsx
+++ b/src/components/Schema/ObjectSchema.tsx
@@ -50,7 +50,7 @@ export const ObjectSchema = observer(
     return (
       <PropertiesTable>
         {showTitle && <PropertiesTableCaption>{title}</PropertiesTableCaption>}
-        <tbody>
+        <tbody className="object-schema">
           {mapWithLast(filteredFields, (field, isLast) => {
             return (
               <Field
diff --git a/src/components/Schema/OneOfSchema.tsx b/src/components/Schema/OneOfSchema.tsx
index 311a3258..f3afe69e 100644
--- a/src/components/Schema/OneOfSchema.tsx
+++ b/src/components/Schema/OneOfSchema.tsx
@@ -51,7 +51,7 @@ export class OneOfSchema extends React.Component<SchemaProps> {
     const activeSchema = oneOf[schema.activeOneOf];
 
     return (
-      <div>
+      <div className="oneOf-schema">
         <OneOfLabel> {schema.oneOfType} </OneOfLabel>
         <OneOfList>
           {oneOf.map((subSchema, idx) => (
diff --git a/src/components/Schema/RecursiveSchema.tsx b/src/components/Schema/RecursiveSchema.tsx
index ad730d5f..ead4aea1 100644
--- a/src/components/Schema/RecursiveSchema.tsx
+++ b/src/components/Schema/RecursiveSchema.tsx
@@ -7,7 +7,7 @@ import type { SchemaProps } from '.';
 
 export const RecursiveSchema = observer(({ schema }: SchemaProps) => {
   return (
-    <div>
+    <div className="recursive-schema">
       <TypeName>{schema.displayType}</TypeName>
       {schema.title && <TypeTitle> {schema.title} </TypeTitle>}
       <RecursiveLabel> {l('recursive')} </RecursiveLabel>
diff --git a/src/components/Schema/Schema.tsx b/src/components/Schema/Schema.tsx
index c0d38b1e..2553bf96 100644
--- a/src/components/Schema/Schema.tsx
+++ b/src/components/Schema/Schema.tsx
@@ -87,7 +87,7 @@ export class Schema extends React.Component<Partial<SchemaProps>> {
     } as any as FieldModel; // cast needed for hot-loader to not fail
 
     return (
-      <div>
+      <div className="field-details">
         <FieldDetails field={field} />
       </div>
     );
diff --git a/src/components/SecurityRequirement/SecurityRequirement.tsx b/src/components/SecurityRequirement/SecurityRequirement.tsx
index cbc39825..56b0c5a9 100644
--- a/src/components/SecurityRequirement/SecurityRequirement.tsx
+++ b/src/components/SecurityRequirement/SecurityRequirement.tsx
@@ -56,7 +56,7 @@ export function SecurityRequirements(props: SecurityRequirementsProps) {
       {expanded &&
         operationSecuritySchemes?.length &&
         operationSecuritySchemes.map((scheme, idx) => (
-          <SecurityDetailsStyle key={idx}>
+          <SecurityDetailsStyle key={idx} className="security-details">
             <h5>
               <LockIcon /> {AUTH_TYPES[scheme.type] || scheme.type}: {scheme.id}
             </h5>
diff --git a/src/components/SourceCode/SourceCode.tsx b/src/components/SourceCode/SourceCode.tsx
index 9a6e352f..b74525c9 100644
--- a/src/components/SourceCode/SourceCode.tsx
+++ b/src/components/SourceCode/SourceCode.tsx
@@ -19,7 +19,7 @@ export const SourceCodeWithCopy = (props: SourceCodeProps) => {
   return (
     <CopyButtonWrapper data={source}>
       {({ renderCopyButton }) => (
-        <SampleControlsWrap>
+        <SampleControlsWrap className="request-code-sample">
           <SampleControls>{renderCopyButton()}</SampleControls>
           <SourceCode lang={lang} source={source} />
         </SampleControlsWrap>