Repository: provectus/kafka-ui
Issue: Change the name of path for Schema Compare versions
Labels: good first issue
scope/frontend
status/accepted
type/chore

**Describe the bug**
Change the name of path for Schema Compare versions

**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. Press Compare Versions
4. Check the Path

**Expected behavior**
Could be better to display 'Compare' instead of 'Diff' for Schema versions compare

**Screenshots**
<img width="1718" alt="vversions schema" src="https://user-images.githubusercontent.com/104780608/174235375-2003fb89-f2b0-421c-bbd1-6397db8c4b94.png">





Issue comments:

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx b/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx
index 386fc505903..299b0984b13 100644
--- a/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx
+++ b/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx
@@ -3,7 +3,7 @@ import { useNavigate } from 'react-router-dom';
 import {
   ClusterSubjectParam,
   clusterSchemaEditPageRelativePath,
-  clusterSchemaSchemaDiffPageRelativePath,
+  clusterSchemaSchemaComparePageRelativePath,
 } from 'lib/paths';
 import ClusterContext from 'components/contexts/ClusterContext';
 import ConfirmationModal from 'components/common/ConfirmationModal/ConfirmationModal';
@@ -90,7 +90,7 @@ const Details: React.FC = () => {
               buttonSize="M"
               buttonType="primary"
               to={{
-                pathname: clusterSchemaSchemaDiffPageRelativePath,
+                pathname: clusterSchemaSchemaComparePageRelativePath,
                 search: `leftVersion=${versions[0]?.version}&rightVersion=${versions[0]?.version}`,
               }}
             >
diff --git a/kafka-ui-react-app/src/components/Schemas/Diff/Diff.tsx b/kafka-ui-react-app/src/components/Schemas/Diff/Diff.tsx
index 4c12bc66fa4..94636fa4b8f 100644
--- a/kafka-ui-react-app/src/components/Schemas/Diff/Diff.tsx
+++ b/kafka-ui-react-app/src/components/Schemas/Diff/Diff.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { SchemaSubject } from 'generated-sources';
-import { clusterSchemaSchemaDiffPath, ClusterSubjectParam } from 'lib/paths';
+import { clusterSchemaSchemaComparePath, ClusterSubjectParam } from 'lib/paths';
 import PageLoader from 'components/common/PageLoader/PageLoader';
 import DiffViewer from 'components/common/DiffViewer/DiffViewer';
 import { useNavigate, useLocation } from 'react-router-dom';
@@ -86,7 +86,7 @@ const Diff: React.FC<DiffProps> = ({ versions, areVersionsFetched }) => {
                       }
                       onChange={(event) => {
                         navigate(
-                          clusterSchemaSchemaDiffPath(clusterName, subject)
+                          clusterSchemaSchemaComparePath(clusterName, subject)
                         );
                         searchParams.set('leftVersion', event.toString());
                         searchParams.set(
@@ -127,7 +127,7 @@ const Diff: React.FC<DiffProps> = ({ versions, areVersionsFetched }) => {
                       }
                       onChange={(event) => {
                         navigate(
-                          clusterSchemaSchemaDiffPath(clusterName, subject)
+                          clusterSchemaSchemaComparePath(clusterName, subject)
                         );
                         searchParams.set(
                           'leftVersion',
diff --git a/kafka-ui-react-app/src/components/Schemas/Diff/__test__/Diff.spec.tsx b/kafka-ui-react-app/src/components/Schemas/Diff/__test__/Diff.spec.tsx
index 418393bb503..029e589b9ad 100644
--- a/kafka-ui-react-app/src/components/Schemas/Diff/__test__/Diff.spec.tsx
+++ b/kafka-ui-react-app/src/components/Schemas/Diff/__test__/Diff.spec.tsx
@@ -2,13 +2,13 @@ import React from 'react';
 import Diff, { DiffProps } from 'components/Schemas/Diff/Diff';
 import { render, WithRoute } from 'lib/testHelpers';
 import { screen } from '@testing-library/react';
-import { clusterSchemaSchemaDiffPath } from 'lib/paths';
+import { clusterSchemaSchemaComparePath } from 'lib/paths';
 
 import { versions } from './fixtures';
 
 const defaultClusterName = 'defaultClusterName';
 const defaultSubject = 'defaultSubject';
-const defaultPathName = clusterSchemaSchemaDiffPath(
+const defaultPathName = clusterSchemaSchemaComparePath(
   defaultClusterName,
   defaultSubject
 );
@@ -30,7 +30,7 @@ describe('Diff', () => {
     pathname = `${pathname}?${searchParams.toString()}`;
 
     return render(
-      <WithRoute path={clusterSchemaSchemaDiffPath()}>
+      <WithRoute path={clusterSchemaSchemaComparePath()}>
         <Diff
           versions={props.versions}
           areVersionsFetched={props.areVersionsFetched}
diff --git a/kafka-ui-react-app/src/lib/paths.ts b/kafka-ui-react-app/src/lib/paths.ts
index 2e15a856a86..4f80d07c14c 100644
--- a/kafka-ui-react-app/src/lib/paths.ts
+++ b/kafka-ui-react-app/src/lib/paths.ts
@@ -72,9 +72,9 @@ export type ClusterGroupParam = {
 export const clusterSchemasRelativePath = 'schemas';
 export const clusterSchemaNewRelativePath = 'create-new';
 export const clusterSchemaEditPageRelativePath = `edit`;
-export const clusterSchemaSchemaDiffPageRelativePath = `diff`;
+export const clusterSchemaSchemaComparePageRelativePath = `compare`;
 export const clusterSchemaEditRelativePath = `${RouteParams.subject}/${clusterSchemaEditPageRelativePath}`;
-export const clusterSchemaSchemaDiffRelativePath = `${RouteParams.subject}/${clusterSchemaSchemaDiffPageRelativePath}`;
+export const clusterSchemaSchemaDiffRelativePath = `${RouteParams.subject}/${clusterSchemaSchemaComparePageRelativePath}`;
 export const clusterSchemasPath = (
   clusterName: ClusterName = RouteParams.clusterName
 ) => `${clusterPath(clusterName)}/schemas`;
@@ -89,10 +89,10 @@ export const clusterSchemaEditPath = (
   clusterName: ClusterName = RouteParams.clusterName,
   subject: SchemaName = RouteParams.subject
 ) => `${clusterSchemasPath(clusterName)}/${subject}/edit`;
-export const clusterSchemaSchemaDiffPath = (
+export const clusterSchemaSchemaComparePath = (
   clusterName: ClusterName = RouteParams.clusterName,
   subject: SchemaName = RouteParams.subject
-) => `${clusterSchemaPath(clusterName, subject)}/diff`;
+) => `${clusterSchemaPath(clusterName, subject)}/compare`;
 
 export type ClusterSubjectParam = {
   subject: string;


Test patch: