NO-JIRA Fix code smells in new code

server/sonar-web/design-system/src/components/Dropdown.tsx

@@ -42,7 +42,7 @@ interface RenderProps {
 interface Props {
   allowResizing?: boolean;
   children:
-    | ((renderProps: RenderProps) => JSX.Element)
+    | ((renderProps: Readonly<RenderProps>) => JSX.Element)
     | React.ReactElement<{ onClick: OnClickCallback }>;
   className?: string;
   closeOnClick?: boolean;
@@ -61,10 +61,10 @@ interface State {
   open: boolean;
 }
 
-export class Dropdown extends React.PureComponent<Props, State> {
+export class Dropdown extends React.PureComponent<Readonly<Props>, State> {
   state: State = { open: false };
 
-  componentDidUpdate(props: Props, prevState: State) {
+  componentDidUpdate(props: Readonly<Props>, prevState: State) {
     if (!prevState.open && this.state.open && this.props.onOpen) {
       this.props.onOpen();
     }
@@ -146,7 +146,7 @@ interface ActionsDropdownProps extends Omit<Props, 'children' | 'overlay'> {
   toggleClassName?: string;
 }
 
-export function ActionsDropdown(props: ActionsDropdownProps) {
+export function ActionsDropdown(props: Readonly<ActionsDropdownProps>) {
   const { children, buttonSize, ariaLabel, toggleClassName, ...dropdownProps } = props;
 
   const intl = useIntl();

server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.tsx

@@ -46,7 +46,7 @@ export interface ComponentNavProps extends WithAvailableFeaturesProps {
   projectBindingErrors?: ProjectAlmBindingConfigurationErrors;
 }
 
-function ComponentNav(props: ComponentNavProps) {
+function ComponentNav(props: Readonly<ComponentNavProps>) {
   const {
     branchLike,
     component,

server/sonar-web/src/main/js/apps/issues/crossComponentSourceViewer/ComponentSourceSnippetGroupViewer.tsx

@@ -81,10 +81,13 @@ interface State {
   snippets: Snippet[];
 }
 
-export default class ComponentSourceSnippetGroupViewer extends React.PureComponent<Props, State> {
+export default class ComponentSourceSnippetGroupViewer extends React.PureComponent<
+  Readonly<Props>,
+  State
+> {
   mounted = false;
 
-  constructor(props: Props) {
+  constructor(props: Readonly<Props>) {
     super(props);
     this.state = {
       additionalLines: {},
@@ -383,7 +386,7 @@ function isExpandable(snippets: Snippet[], snippetGroup: SnippetGroup) {
     snippets.length === 1 &&
     snippetGroup.component.measures &&
     snippets[0].end - snippets[0].start ===
-      parseInt(snippetGroup.component.measures.lines || '', 10);
+      parseInt(snippetGroup.component.measures.lines ?? '', 10);
 
   return !fullyShown && isFile(snippetGroup.component.q);
 }

server/sonar-web/src/main/js/apps/projectNewCode/components/ProjectNewCodeDefinitionSelector.tsx

@@ -66,7 +66,9 @@ function branchToOption(b: Branch) {
   return { label: b.name, value: b.name, isMain: b.isMain };
 }
 
-export default function ProjectNewCodeDefinitionSelector(props: ProjectBaselineSelectorProps) {
+export default function ProjectNewCodeDefinitionSelector(
+  props: Readonly<ProjectBaselineSelectorProps>,
+) {
   const {
     analysis,
     branch,

server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileRules.tsx

@@ -59,7 +59,7 @@ interface State {
   total: number | null;
 }
 
-export default class ProfileRules extends React.PureComponent<Props, State> {
+export default class ProfileRules extends React.PureComponent<Readonly<Props>, State> {
   mounted = false;
 
   state: State = {
@@ -127,7 +127,7 @@ export default class ProfileRules extends React.PureComponent<Props, State> {
             activatedTotal: activatedRules.paging.total,
             allByType: keyBy<ByType>(this.takeFacet(allRules, 'types'), 'val'),
             activatedByType: keyBy<ByType>(this.takeFacet(activatedRules, 'types'), 'val'),
-            compareToSonarWay: showProfile && showProfile.compareToSonarWay,
+            compareToSonarWay: showProfile?.compareToSonarWay,
             total: allRules.paging.total,
           });
         }
@@ -135,18 +135,6 @@ export default class ProfileRules extends React.PureComponent<Props, State> {
     );
   }
 
-  getRulesCountForType(type: string) {
-    return this.state.activatedByType && this.state.activatedByType[type]
-      ? this.state.activatedByType[type].count
-      : null;
-  }
-
-  getRulesTotalForType(type: string) {
-    return this.state.allByType && this.state.allByType[type]
-      ? this.state.allByType[type].count
-      : null;
-  }
-
   takeFacet(response: SearchRulesResponse, property: string) {
     const facet = response.facets?.find((f) => f.property === property);
     return facet ? facet.values : [];

server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileRulesRow.tsx

@@ -33,7 +33,7 @@ interface Props {
   type?: string;
 }
 
-export default function ProfileRulesRowOfType(props: Props) {
+export default function ProfileRulesRowOfType(props: Readonly<Props>) {
   const activeRulesUrl = getRulesUrl({
     qprofile: props.qprofile,
     activation: 'true',

server/sonar-web/src/main/js/apps/settings/components/almIntegration/AlmBindingDefinitionFormRenderer.tsx

@@ -53,7 +53,7 @@ export interface Props {
   validationError?: string;
 }
 
-export default class AlmBindingDefinitionFormRenderer extends React.PureComponent<Props> {
+export default class AlmBindingDefinitionFormRenderer extends React.PureComponent<Readonly<Props>> {
   renderForm = () => {
     const { alm, formData, isUpdate, bitbucketVariant } = this.props;
 

server/sonar-web/src/main/js/apps/settings/components/almIntegration/BitbucketForm.tsx

@@ -39,7 +39,7 @@ export interface BitbucketFormProps {
   onVariantChange: (variant: AlmKeys.BitbucketServer | AlmKeys.BitbucketCloud) => void;
 }
 
-export default function BitbucketForm(props: BitbucketFormProps) {
+export default function BitbucketForm(props: Readonly<BitbucketFormProps>) {
   const { isUpdate, formData, variant } = props;
 
   return (

server/sonar-web/src/main/js/components/controls/Select.tsx

@@ -97,7 +97,7 @@ export default function Select<
   Option = LabelValueSelectOption,
   IsMulti extends boolean = boolean,
   Group extends GroupBase<Option> = GroupBase<Option>,
->(props: NamedProps<Option, IsMulti, Group> & StyleExtensionProps) {
+>(props: NamedProps<Option, IsMulti, Group> & Readonly<StyleExtensionProps>) {
   return (
     <ReactSelect<Option, IsMulti, Group>
       {...omit(props, 'className', 'large')}
@@ -141,7 +141,7 @@ export function SearchSelect<
 >(
   props: NamedProps<Option, IsMulti, Group> &
     AsyncProps<Option, IsMulti, Group> &
-    StyleExtensionProps,
+    Readonly<StyleExtensionProps>,
 ) {
   return (
     <AsyncReactSelect<Option, IsMulti, Group>
@@ -167,7 +167,7 @@ export function selectStyle<
 >(
   props?: NamedProps<Option, IsMulti, Group> &
     AsyncProps<Option, IsMulti, Group> &
-    StyleExtensionProps,
+    Readonly<StyleExtensionProps>,
 ): StylesConfig<Option, IsMulti, Group> {
   return {
     container: () => ({

server/sonar-web/src/main/js/components/new-code-definition/NCDAutoUpdateMessage.tsx

@@ -39,7 +39,7 @@ interface NCDAutoUpdateMessageProps extends Pick<CurrentUserContextInterface, 'c
   component?: Component;
 }
 
-function NCDAutoUpdateMessage(props: NCDAutoUpdateMessageProps) {
+function NCDAutoUpdateMessage(props: Readonly<NCDAutoUpdateMessageProps>) {
   const { branchName, component, currentUser } = props;
   const isGlobalBanner = component === undefined;
   const intl = useIntl();

server/sonar-web/src/main/js/components/ui/AdminPageHeader.tsx

@@ -30,7 +30,7 @@ interface Props {
   title: ReactNode;
 }
 
-export function AdminPageHeader({ children, className, description, title }: Props) {
+export function AdminPageHeader({ children, className, description, title }: Readonly<Props>) {
   return (
     <div className={classNames('sw-flex sw-justify-between', className)}>
       <header className="sw-flex-1">