# Source: https://developers.raycast.com/misc/migration/v1.31.0.md

# v1.31.0

This version introduces support for multiple `<List.Item>` accessories via a new [`accessories` prop](https://developers.raycast.com/api-reference/user-interface/list#list.item.accessory).

{% hint style="info" %}
The `accessoryTitle` and `accessoryIcon` props still work, but are now marked as deprecated and may be removed in a future version. You will get helpful hints in your code editor to migrate your extension, and as usual we provide automated [migrations](https://developers.raycast.com/misc/migration) to help with the transition.
{% endhint %}

To migrate your extension manually, you need to ensure that all `List.Items` that specify `accessoryTitle` and/or `accessoryIcon` are updated as follows:

## `List.Item` with `accessoryTitle`

```typescript
<List.Item title="List item with accessory title" accessoryTitle="foo" />
// becomes
<List.Item title="List item with accessory title" accessories={[{ text: 'foo' }]}
```

## `List.Item` with `accessoryIcon`

```typescript
<List.Item title="List item with accessory icon" accessoryIcon={getAccessoryIcon()} />
// becomes
<List.Item title="List item with accessory icon" accessories={[{ icon: getAccessoryIcon() }]}
```

## `List.Item` with `accessoryTitle` and `accessoryIcon`

```typescript
<List.Item title="List item with accessory title and accessory icon" accessoryTitle="foo" accessoryIcon={getAccessoryIcon()} />
// becomes
<List.Item title="List item with accessory title and accessory icon" accessories={[{ text: "foo", icon: getAccessoryIcon() }]}
```