Autocomplete component - changing defaultValue prop has no affect

Describe the bug In the <Autocomplete /> component doesn't update if the defaultValue prop is changed.

Suggested fix:

React.useEffect(() => {
    setUserInput(defaultValue);
}, [defaultValue]);

At around line 368.

To Reproduce Steps to reproduce the behavior: Use this component in a form that has its own state. Pass a piece of that state to <Autocomplete /> as its defaultValue prop. Update the state in the form. Autocomplete doesn't update its selected value accordingly.

In the dcx library replace the contents of example/src/components/AutocompleteDemo.tsx with the following:

import * as React from 'react';
import { Autocomplete } from '@capgeminiuk/dcx-react-library';

export const AutocompleteDemo = () => {
  const [defaultValue, setDefaultValue] = React.useState('Apple');
  const handleClick = (value: string) => {
    setDefaultValue(value);
  };

  return (
    <>
      default value = [{defaultValue}]
      <button onClick={() => handleClick('Apple')}>Apple</button>
      <button onClick={() => handleClick('Banana')}>Banana</button>
      <Autocomplete
        options={[
          'Apple',
          'Banana',
          'Coconut',
          'Jambul',
          'Peach',
          'Pomegranate',
          'Pineapple',
          'Mulberry',
          'Lychee',
        ]}
        defaultValue={defaultValue}
        onSelected={(value) => handleClick(value)}
      />
    </>
  );
};

Expected behavior it should update the value passed

Please follow the following instruction to create the new branch:

git checkout release/0.8 git pull git checkout -b 'feature/autocomplete-update-value'

Capgemini / dcx-react-library

Autocomplete component - changing defaultValue prop has no affect #462