FIX Do not show delete button when disabled

client/src/components/LinkPicker/LinkPickerTitle.js

@@ -101,7 +101,7 @@ const LinkPickerTitle = ({
           <span className="link-picker__url">{description}</span>
         </small>
       </div>
-      {(canDelete && !readonly) &&
+      {(canDelete && !readonly && !disabled) &&
         // This is a <span> rather than a <Button> because we're inside a <Button> and
         // trigger an error when you attempt to nest a <Button> inside a <Button>.
         <span

client/src/components/LinkPicker/tests/LinkPickerTitle-test.js

@@ -43,6 +43,20 @@ test('LinkPickerTitle render() should not display clear button if cannot delete'
   expect(container.querySelectorAll('.link-picker__delete')).toHaveLength(0);
 });
 
+test('LinkPickerTitle render() should not display clear button if readonly', () => {
+  const { container } = render(<LinkFieldContext.Provider value={{ loading: false }}>
+    <LinkPickerTitle {...makeProps({ readonly: true })} />
+  </LinkFieldContext.Provider>);
+  expect(container.querySelectorAll('.link-picker__delete')).toHaveLength(0);
+});
+
+test('LinkPickerTitle render() should not display clear button if disabled', () => {
+  const { container } = render(<LinkFieldContext.Provider value={{ loading: false }}>
+    <LinkPickerTitle {...makeProps({ readonly: true })} />
+  </LinkFieldContext.Provider>);
+  expect(container.querySelectorAll('.link-picker__delete')).toHaveLength(0);
+});
+
 test('LinkPickerTitle render() should display link type icon', () => {
   const { container } = render(<LinkFieldContext.Provider value={{ loading: false }}>
     <LinkPickerTitle {...makeProps({ canDelete: false })} />