feedback-to-code/mozzarella huggingface dataset:
Repository: provectus/kafka-ui
Issue: "Value" field is focused with adding the Custom Parameter in a Topic
Labels: good first issue
scope/frontend
status/accepted
status/confirmed
type/chore


**Describe the bug**
"Value" field is focused with adding the Custom Parameter in a Topic

**Set up**
https://www.kafka-ui.provectus.io/

**Steps to Reproduce**

1. Navigate to Topics
2. Add a Topic
3. Press "Add Custom Parameter"

**Expected behavior**
Value field shouldn’t be focused

**Screenshots**

https://user-images.githubusercontent.com/104780608/178551325-f86dbc4e-166d-4131-a4ec-f89b5f950838.mov






Issue comments:

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-react-app/src/components/Topics/shared/Form/CustomParams/CustomParams.tsx b/kafka-ui-react-app/src/components/Topics/shared/Form/CustomParams/CustomParams.tsx
index 38d95f56c8b..a85b4a2fc4d 100644
--- a/kafka-ui-react-app/src/components/Topics/shared/Form/CustomParams/CustomParams.tsx
+++ b/kafka-ui-react-app/src/components/Topics/shared/Form/CustomParams/CustomParams.tsx
@@ -57,7 +57,9 @@ const CustomParams: React.FC<CustomParamsProps> = ({ isSubmitting }) => {
           type="button"
           buttonSize="M"
           buttonType="secondary"
-          onClick={() => append({ name: '', value: '' })}
+          onClick={() =>
+            append({ name: '', value: '' }, { shouldFocus: false })
+          }
         >
           <PlusIcon />
           Add Custom Parameter


Test patch:
Repository: provectus/kafka-ui
Issue: Security Vulnerabilities in the master tag
Labels: scope/backend
type/security
status/accepted

Hello team,

We're planning to use kafka-ui to use its features to manage, troubleshoot and maintain our kafka cluster. As part of that we were doing the security scan for the latest image but it had a lot of vulnerabilities (30+). We then used the master tag of the image, which significantly improves on the Vuln report and now we only see 4 CVEs out of which 2 are critical. 
Below are the CVEs and their CVSS3.1 score-
CVE-2016-1000027 - 9.8
CVE-2022-37434 - 9.8
CVE-2022-25647 - 7.5
CVE-2021-22569 - 5.5

To be able to proceed further, we need the critical vulnerabilities to be fixed. Please let us know-

1. By when the new release will be available (which has many security vuln fixed)
2. What is the plan for fixing the above two critical vuln? Can these be fixed in the upcoming release?

Find attached the security report-
[Docker_326c2dc_Security_Export.csv](https://github.com/provectus/kafka-ui/files/9392239/Docker_326c2dc_Security_Export.csv)


Issue comments:
Hello there AmarendraSingh88! 👋

Thank you and congratulations 🎉 for opening your very first issue in this project! 💖

In case you want to claim this issue, please comment down below! We will try to get back to you as soon as we can. 👀
Yes, I want to know the plan for fixing these vulnerabilities and also the next release date.
Hey, thanks for reaching out.

We have periodic CVE scans [enabled](https://github.com/provectus/kafka-ui/actions/workflows/cve.yaml) and just the recent ones were green. We'll take a look into new CVEs.

Also, you can always pull `master`-labeled image with the fixes you need, there's no need to wait for a release. 

@AmarendraSingh88 feel free to pull `master`-labeled image

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-api/Dockerfile b/kafka-ui-api/Dockerfile
index 3990d488315..2cd5fe08e55 100644
--- a/kafka-ui-api/Dockerfile
+++ b/kafka-ui-api/Dockerfile
@@ -1,4 +1,4 @@
-FROM alpine:3.16.1
+FROM alpine:3.16.2
 
 RUN apk add --no-cache openjdk13-jre libc6-compat gcompat \
 && addgroup -S kafkaui && adduser -S kafkaui -G kafkaui


Test patch:
Repository: provectus/kafka-ui
Issue: System redirects to Topics list with cancelling Topic edit instead of turning to Topic profile
Labels: type/bug
good first issue
scope/frontend
status/accepted
status/confirmed

**Describe the bug**
System redirects to Topics list with cancelling Topic edit instead of redirecting to Topic profile

**Set up**
https://www.kafka-ui.provectus.io/


**Steps to Reproduce**
<!-- We'd like you to provide an example setup (via docker-compose, helm, etc.) 
to reproduce the problem, especially with a complex setups. -->
Steps to reproduce the behavior:

1. Navigate to Topics
2. Select the Topic
3. Press "Edit Settings" from menu
4. Cancel the editing
 

**Expected behavior**
System should turn to Topic profile instead of Topics list

**Screenshots**

https://user-images.githubusercontent.com/104780608/182797421-2ae85414-2aee-4237-a242-634b932409a0.mov




Issue comments:

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-react-app/src/components/Topics/shared/Form/TopicForm.tsx b/kafka-ui-react-app/src/components/Topics/shared/Form/TopicForm.tsx
index 1838e209ba8..20898e8de6d 100644
--- a/kafka-ui-react-app/src/components/Topics/shared/Form/TopicForm.tsx
+++ b/kafka-ui-react-app/src/components/Topics/shared/Form/TopicForm.tsx
@@ -9,7 +9,7 @@ import { Button } from 'components/common/Button/Button';
 import { InputLabel } from 'components/common/Input/InputLabel.styled';
 import { FormError } from 'components/common/Input/Input.styled';
 import { StyledForm } from 'components/common/Form/Form.styled';
-import { clusterTopicsPath } from 'lib/paths';
+import { clusterTopicPath } from 'lib/paths';
 import { useNavigate } from 'react-router-dom';
 import useAppParams from 'lib/hooks/useAppParams';
 
@@ -76,7 +76,7 @@ const TopicForm: React.FC<Props> = ({
 
   const onCancel = () => {
     reset();
-    navigate(clusterTopicsPath(clusterName));
+    navigate(clusterTopicPath(clusterName, topicName));
   };
 
   return (


Test patch:
Repository: provectus/kafka-ui
Issue: [Helm] base64 encode secrets
Labels: type/bug
good first issue
status/accepted
status/confirmed
scope/k8s

### Discussed in https://github.com/provectus/kafka-ui/discussions/2389

<div type='discussions-op-text'>

<sup>Originally posted by **cignul9** August  4, 2022</sup>
When using envs.secret to store...secrets the chart fails because values are not encoded in the template.  We can encode them beforehand, but that's not very user friendly.  Would you consider changing kafka-ui/charts/kafka-ui/templates/secret.yaml line 9 from 
```
  {{- toYaml .Values.envs.secret | nindent 2 }}
```
to
```
  {{- toYaml .Values.envs.secret | b64enc | nindent 2 }}
```
?</div>

Issue comments:

Pull request review comments:

Patch that resolved the issue:
diff --git a/charts/kafka-ui/Chart.yaml b/charts/kafka-ui/Chart.yaml
index 7eaff3c59aa..e0d9b0b1611 100644
--- a/charts/kafka-ui/Chart.yaml
+++ b/charts/kafka-ui/Chart.yaml
@@ -2,6 +2,6 @@ apiVersion: v2
 name: kafka-ui
 description: A Helm chart for kafka-UI
 type: application
-version: 0.4.2
+version: 0.4.3
 appVersion: latest
 icon: https://github.com/provectus/kafka-ui/raw/master/documentation/images/kafka-ui-logo.png
diff --git a/charts/kafka-ui/templates/secret.yaml b/charts/kafka-ui/templates/secret.yaml
index a2ebf0fdba8..a2d1f25fa2f 100644
--- a/charts/kafka-ui/templates/secret.yaml
+++ b/charts/kafka-ui/templates/secret.yaml
@@ -6,4 +6,6 @@ metadata:
     {{- include "kafka-ui.labels" . | nindent 4 }}
 type: Opaque
 data:
-  {{- toYaml .Values.envs.secret | nindent 2 }}
\ No newline at end of file
+  {{- range $key, $val := .Values.envs.secret }}
+  {{ $key }}: {{ $val | b64enc | quote }}
+  {{- end -}}


Test patch:
Repository: provectus/kafka-ui
Issue: [e2e] update read.me file for 'kafka-ui-e2e-checks' module with actual steps 
Labels: type/documentation
scope/QA
status/accepted

need to update with steps:
cd kafka-ui
docker-compose -f documentation/compose/kafka-ui-connectors.yaml up -d // to create containers
add token // for Qase integration
mvn -pl '!kafka-ui-api' test -Pprod // to run tests
reports: allure serve // to get reports

Issue comments:

Pull request review comments:
let's do this via env props
done

Patch that resolved the issue:
diff --git a/kafka-ui-e2e-checks/README.md b/kafka-ui-e2e-checks/README.md
index 25dc51d658b..4cd986dc475 100644
--- a/kafka-ui-e2e-checks/README.md
+++ b/kafka-ui-e2e-checks/README.md
@@ -45,58 +45,20 @@ docker pull selenoid/vnc:chrome_86.0
 
 ### How to run checks
 
-1. Run `kafka-ui` 
+1. Run `kafka-ui`: 
 ```
-cd docker
-docker-compose -f kafka-ui.yaml up -d
+cd kafka-ui
+docker-compose -f documentation/compose/kafka-ui-connectors.yaml up -d
 ```
-2. Run `selenoid-ui` 
+2. Run tests using your QaseIO API token as environment variable (put instead $s into command below)
 ```
-cd kafka-ui-e2e-checks/docker
-docker-compose -f selenoid.yaml up -d
+mvn -DQASEIO_API_TOKEN=‘%s’ -pl ‘!kafka-ui-api’ test -Pprod
 ```
-3. Compile `kafka-ui-contract` project
-```
-cd <projectRoot>/kafka-ui-contract
-mvn clean compile
-```
-4. Run checks 
-```
-cd kafka-ui-e2e-checks
-mvn test
-```
-
-* There are several ways to run checks
-
-1. If you don't have  selenoid run on your machine
-```
- mvn test -DSHOULD_START_SELENOID=true
-```
-⚠️ If you want to run checks in IDE with this approach, you'd need to set up
-environment variable(`SHOULD_START_SELENOID=true`) in `Run/Edit Configurations..`
-
-2. For development purposes it is better to just start separate selenoid in docker-compose
-Do it in separate window
-```
-cd docker
-docker-compose -f selenoid.yaml up
-```
-Then you can just `mvn test`. By default, `SELENOID_URL` will resolve to `http://localhost:4444/wd/hub`
-
-It's preferred way to run. 
-
-* If you have remote selenoid instance, set 
-
-`SELENOID_URL` environment variable
-
-Example:
-`mvn test -DSELENOID_URL=http://localhost:4444/wd/hub`
-That's the way to run tests in CI with selenoid set up somewhere in cloud
 
 ### Reporting
 
 Reports are in `allure-results` folder.
-If you have installed allure commandline(e.g. like [here](https://docs.qameta.io/allure/#_installing_a_commandline) or [here](https://www.npmjs.com/package/allure-commandline))
+If you have installed allure commandline [here](https://www.npmjs.com/package/allure-commandline))
 You can see allure report with command:
 ```
 allure serve


Test patch:
Repository: provectus/kafka-ui
Issue: The 'e' letter allowed to paste into number fields within Create a topic 
Labels: type/bug
good first issue
scope/frontend
status/accepted
status/confirmed

**Describe the bug**
the 'e' letter allowed to paste into number fields within Create a topic 

**Set up**
https://www.kafka-ui.provectus.io/

**Steps to Reproduce**
Steps to reproduce the behavior:

1. Navigate to Topics
2. Add a Topic
3. Copy and paste word including 'e' letter into number fields

**Expected behavior**
Letters should not be allowed for number fields




Issue comments:

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-react-app/src/components/common/Input/Input.tsx b/kafka-ui-react-app/src/components/common/Input/Input.tsx
index 58a3bb92c85..d6c6416bfe7 100644
--- a/kafka-ui-react-app/src/components/common/Input/Input.tsx
+++ b/kafka-ui-react-app/src/components/common/Input/Input.tsx
@@ -17,6 +17,7 @@ const Input: React.FC<InputProps> = ({
   hookFormOptions,
   search,
   inputSize = 'L',
+  type,
   ...rest
 }) => {
   const methods = useFormContext();
@@ -28,10 +29,30 @@ const Input: React.FC<InputProps> = ({
           inputSize={inputSize}
           {...methods.register(name, { ...hookFormOptions })}
           hasLeftIcon={!!search}
+          type={type}
           {...rest}
+          onKeyDown={(e) => {
+            if (type === 'number') {
+              if (e.key === 'e') {
+                e.preventDefault();
+              }
+            }
+          }}
+          onPaste={(e) => {
+            if (type === 'number') {
+              e.preventDefault();
+              const value = e.clipboardData.getData('Text');
+              methods.setValue(name, value.replace(/[^\d.]/g, ''));
+            }
+          }}
         />
       ) : (
-        <S.Input inputSize={inputSize} hasLeftIcon={!!search} {...rest} />
+        <S.Input
+          inputSize={inputSize}
+          hasLeftIcon={!!search}
+          type={type}
+          {...rest}
+        />
       )}
     </S.Wrapper>
   );


Test patch:
Repository: provectus/kafka-ui
Issue: Handle error message for schemas
Labels: type/enhancement
good first issue
scope/backend
status/accepted

**Describe the bug**
Not user friendly error message appears with submitting wrong data in Schema

**Set up**
https://www.kafka-ui.provectus.io/


**Steps to Reproduce**
Steps to reproduce the behavior:

1. Navigate to Schema Registry 
2. Open the schema
3. Edit the schema
4. Let any field empty or input wrong data
5. Press submit

**Expected behavior**
Error message about wrong data should be user friendly to indicate which data is wrong 

**Screenshots**
<img width="1718" alt="error message schema" src="https://user-images.githubusercontent.com/104780608/173566018-8e125a64-c4dc-48e3-ab3c-950f3ef45b51.png">






Issue comments:
@armenuikafka I tried to reproduce this issue, although, I'm getting this error:
![Screen Shot 2022-08-31 at 12 15 57](https://user-images.githubusercontent.com/110129035/187750536-a96905db-6fef-4ea8-b71c-160f01884fce.png)

Could you confirm if you still get the ugly error using the latest codebase? I wonder if I'm doing something wrong or if it's already fixed.
@daching-provectus hey, the error still actual on master. 

Steps to reproduse:
- Use the avro schema type
- edit the schema
- delete any property ("name")
- submit



https://user-images.githubusercontent.com/104780608/187843020-c9469cd4-0044-4fbd-96b3-362dd13a58e0.mov




Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-api/src/main/java/com/provectus/kafka/ui/service/SchemaRegistryService.java b/kafka-ui-api/src/main/java/com/provectus/kafka/ui/service/SchemaRegistryService.java
index 92603ba979e..2a3039b3fe4 100644
--- a/kafka-ui-api/src/main/java/com/provectus/kafka/ui/service/SchemaRegistryService.java
+++ b/kafka-ui-api/src/main/java/com/provectus/kafka/ui/service/SchemaRegistryService.java
@@ -66,6 +66,7 @@ public class SchemaRegistryService {
 
   private static final String UNRECOGNIZED_FIELD_SCHEMA_TYPE = "Unrecognized field: schemaType";
   private static final String INCOMPATIBLE_WITH_AN_EARLIER_SCHEMA = "incompatible with an earlier schema";
+  private static final String INVALID_SCHEMA = "Invalid Schema";
 
   private final WebClient webClient;
 
@@ -237,7 +238,8 @@ private Mono<Throwable> getMonoError(ErrorResponse x) {
     } else if (isIncompatibleSchemaMessage(x.getMessage())) {
       return Mono.error(new SchemaCompatibilityException(x.getMessage()));
     } else {
-      return Mono.error(new UnprocessableEntityException(x.getMessage()));
+      log.error(x.getMessage());
+      return Mono.error(new UnprocessableEntityException(INVALID_SCHEMA));
     }
   }
 


Test patch:
Repository: provectus/kafka-ui
Issue: Display build date instead of full commit hash in version info
Labels: type/enhancement
scope/backend
scope/frontend
status/accepted

1. Remove VITE_TAG
1. Remove VITE_COMMIT
1. fetch info from Spring API `/actuator/info` `{commit, tag, buildDate: timestamp}`
1. If tag is a version (v0.5.0) fetch latest version from github and compare with tag.
6. If tag is a commit we need to display formatted timestamp (`/api/info/timestampformat/iso`)
7. if tag contains `-SNAPSHOT` - display formatted timestamp
9. Keep the short one with the link


Issue comments:
`{"git":{"commit":{"id":"c8306f5"}},"build":{"artifact":"kafka-ui-api","name":"kafka-ui-api","time":"2022-09-15T02:31:12.047Z","version":"0.0.1-SNAPSHOT","group":"com.provectus"}}`
#2583
7th point is unclear
> 7th point is unclear

a short commit contains a link, let's keep it

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-api/pom.xml b/kafka-ui-api/pom.xml
index a43c087b428..0cee2260f90 100644
--- a/kafka-ui-api/pom.xml
+++ b/kafka-ui-api/pom.xml
@@ -231,6 +231,7 @@
                     <execution>
                         <goals>
                             <goal>repackage</goal>
+                            <goal>build-info</goal>
                         </goals>
                     </execution>
                 </executions>


Test patch:
Repository: provectus/kafka-ui
Issue: Rename "Total Broker" to "Broker Count"
Labels: good first issue
scope/frontend
status/accepted
type/chore

**Describe the bug**
Rename "Total Broker" to "Broker Count"

**Set up**
https://www.kafka-ui.provectus.io/ui/clusters/local/brokers


**Screenshots**
<img width="1711" alt="total brokers" src="https://user-images.githubusercontent.com/104780608/188552969-4cf84295-e120-4827-acdc-51106e41ee33.png">


Issue comments:
A thought, change it to "Broker Count" maybe? :)

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-react-app/src/components/Brokers/BrokersList/BrokersList.tsx b/kafka-ui-react-app/src/components/Brokers/BrokersList/BrokersList.tsx
index 0cefb30fb04..9f63be31c29 100644
--- a/kafka-ui-react-app/src/components/Brokers/BrokersList/BrokersList.tsx
+++ b/kafka-ui-react-app/src/components/Brokers/BrokersList/BrokersList.tsx
@@ -63,7 +63,7 @@ const BrokersList: React.FC = () => {
       <PageHeading text="Brokers" />
       <Metrics.Wrapper>
         <Metrics.Section title="Uptime">
-          <Metrics.Indicator label="Total Broker">
+          <Metrics.Indicator label="Broker Count">
             {brokerCount}
           </Metrics.Indicator>
           <Metrics.Indicator label="Active Controllers">


Test patch:
Repository: provectus/kafka-ui
Issue: Change the "Back to custom filters" link text within Saved filters
Labels: good first issue
scope/frontend
status/accepted
type/chore


**Describe the bug**
Change the "Back to custom filters" link text to be "Back to create filter" within Saved filters of Topic/Messages tab

**Set up**
https://www.kafka-ui.provectus.io/


**Steps to Reproduce**
<!-- We'd like you to provide an example setup (via docker-compose, helm, etc.) 
to reproduce the problem, especially with a complex setups. -->
Steps to reproduce the behavior:

1. Navigate to Topic/Messages tab
2. Add filter
3. Press Saved filters


**Expected behavior**
The "Back to custom filters" link text should be "Back to create filter"

**Screenshots**
<img width="1437" alt="back to create" src="https://user-images.githubusercontent.com/104780608/189111269-3884c52f-9c71-458a-a021-44a4adcd499f.png">




Issue comments:
I like to work on this issue.

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Messages/Filters/SavedFilters.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Messages/Filters/SavedFilters.tsx
index 26036ae9aea..6a757d34383 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Messages/Filters/SavedFilters.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Messages/Filters/SavedFilters.tsx
@@ -58,7 +58,7 @@ const SavedFilters: FC<Props> = ({
   return (
     <>
       <S.BackToCustomText onClick={onGoBack}>
-        Back To custom filters
+        Back To create filters
       </S.BackToCustomText>
       <S.SavedFiltersContainer>
         <S.CreatedFilter>Saved filters</S.CreatedFilter>
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Messages/Filters/__tests__/SavedFilters.spec.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Messages/Filters/__tests__/SavedFilters.spec.tsx
index e8b9178e54a..cac3bee8ec6 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Messages/Filters/__tests__/SavedFilters.spec.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Messages/Filters/__tests__/SavedFilters.spec.tsx
@@ -45,7 +45,7 @@ describe('SavedFilter Component', () => {
   it('should check on go back button click', () => {
     const onGoBackMock = jest.fn();
     setUpComponent({ onGoBack: onGoBackMock });
-    userEvent.click(screen.getByText(/back to custom filters/i));
+    userEvent.click(screen.getByText(/back to create filters/i));
     expect(onGoBackMock).toHaveBeenCalled();
   });
 


Test patch:
Repository: provectus/kafka-ui
Issue: Create schema view is too wide
Labels: good first issue
scope/frontend
status/accepted
type/chore


**Describe the bug**
Create schema view is too wide, please make smaller the fields

**Set up**
https://www.kafka-ui.provectus.io/


**Steps to Reproduce**


1. Navigate to Schema registry
2. Press "Create Schema"

**Expected behavior**

View is too wide, make smaller

**Screenshots**
<img width="1717" alt="create schema" src="https://user-images.githubusercontent.com/104780608/188563301-dc0106fd-b843-4c74-a948-4c2e1cfc1f39.png">




Issue comments:

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-react-app/src/components/Schemas/New/New.styled.ts b/kafka-ui-react-app/src/components/Schemas/New/New.styled.ts
index e7cf70ea276..257c18df1b0 100644
--- a/kafka-ui-react-app/src/components/Schemas/New/New.styled.ts
+++ b/kafka-ui-react-app/src/components/Schemas/New/New.styled.ts
@@ -6,6 +6,7 @@ export const Form = styled.form`
   display: flex;
   flex-direction: column;
   gap: 16px;
+  width: 50%;
 
   & > button {
     align-self: flex-start;
diff --git a/kafka-ui-react-app/src/components/Schemas/New/New.tsx b/kafka-ui-react-app/src/components/Schemas/New/New.tsx
index 21afda96e0d..39fa49e7416 100644
--- a/kafka-ui-react-app/src/components/Schemas/New/New.tsx
+++ b/kafka-ui-react-app/src/components/Schemas/New/New.tsx
@@ -120,7 +120,7 @@ const New: React.FC = () => {
                 name={name}
                 value={value}
                 onChange={onChange}
-                minWidth="50%"
+                minWidth="100%"
                 disabled={isSubmitting}
                 options={SchemaTypeOptions}
               />


Test patch:
Repository: provectus/kafka-ui
Issue: Schema registry: Previous version's schema preview is too narrow
Labels: type/bug
scope/frontend
status/accepted
status/confirmed

Preview of the previous schema version is a lot narrower, than the window size. Checked in:

- Safari 15.6.1 (17613.3.9.1.16), 
- Chrome 105.0.5195.125 (Official Build) (x86_64)
- Brave 1.43.88 Chromium: 105.0.5195.68 (Official Build) (x86_64)


**Set up**
App version: e621a172d5d9a065dd1d6064099bac3aadc32549
(
[e621a17](https://github.com/provectus/kafka-ui/commit/e621a17)
)
URL: http://master.internal.kafka-ui.provectus.io/ui/clusters/local/schemas/avro2


**Steps to Reproduce**
1. Navigate to "Schema registry"2. 
2. Open one of the schemas.
3.  click on the plus button in "Old versions" section.

**Actual behavior**
Preview looks very narrow and barely useable.
![image](https://user-images.githubusercontent.com/112083452/191220995-3eb0c48b-cdd9-4d48-a127-8269050ea27e.png)

**Expected behavior**
A schema preview should match the "Old versions" container width. Setting minimum width for the preview might be a plus.


**Additional context**


Issue comments:
Hello there BulatKha! 👋

Thank you and congratulations 🎉 for opening your very first issue in this project! 💖

In case you want to claim this issue, please comment down below! We will try to get back to you as soon as we can. 👀
I'd lik to take this one.

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-react-app/src/components/Schemas/Details/SchemaVersion/SchemaVersion.tsx b/kafka-ui-react-app/src/components/Schemas/Details/SchemaVersion/SchemaVersion.tsx
index 1a729a6eaec..472a6e544fd 100644
--- a/kafka-ui-react-app/src/components/Schemas/Details/SchemaVersion/SchemaVersion.tsx
+++ b/kafka-ui-react-app/src/components/Schemas/Details/SchemaVersion/SchemaVersion.tsx
@@ -30,7 +30,7 @@ const SchemaVersion: React.FC<SchemaVersionProps> = ({
       </tr>
       {isOpen && (
         <S.Wrapper>
-          <td colSpan={3}>
+          <td colSpan={4}>
             <EditorViewer data={schema} schemaType={schemaType} />
           </td>
         </S.Wrapper>


Test patch: