From 73f2ea43ac54cb539d8ad13dbe6d8e3543eb7019 Mon Sep 17 00:00:00 2001
From: chaofan <chaofan1801@gmail.com>
Date: Thu, 28 Oct 2021 09:51:10 +1100
Subject: [PATCH] fix: console warnings

---
 www/examples/Tile.mdx           | 4 ++--
 www/examples/UserListPicker.mdx | 7 ++++---
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/www/examples/Tile.mdx b/www/examples/Tile.mdx
index 7becff355..12a295977 100644
--- a/www/examples/Tile.mdx
+++ b/www/examples/Tile.mdx
@@ -34,8 +34,8 @@ const Example = () => {
     <div>
       <React.Fragment>
         <Carousel autoplay={false} style={{ width: '55vw' }} dots={false}>
-          {_.map(items, (item) => (
-            <Tile {...item} style={{ paddingRight: 10, width: 220, height: 300 }} />
+          {_.map(items, (item, i) => (
+            <Tile key={i} {...item} style={{ paddingRight: 10, width: 220, height: 300 }} />
           ))}
         </Carousel>
       </React.Fragment>
diff --git a/www/examples/UserListPicker.mdx b/www/examples/UserListPicker.mdx
index fdfe3ede2..1611ef4bc 100644
--- a/www/examples/UserListPicker.mdx
+++ b/www/examples/UserListPicker.mdx
@@ -4,16 +4,17 @@ import DesignNotes from '../containers/DesignNotes.jsx';
 ## User List Picker
 
 ```jsx live=true
-const avatarColor = (user) => (user.avatar ? '' : 'cyan');
+const avatarColor = (user) => (user.status === 'active' ? 'blue' : 'orange');
 const emptySvgSymbol = <SvgSymbol href="./assets/svg-symbols.svg#checklist-incomplete" />;
 const teamMember1 = {
   avatar: '../assets/user-avatar.jpeg',
   givenName: 'John',
   id: 1,
   surname: 'Smith',
+  status: 'active',
 };
-const teamMember2 = { givenName: 'Jane', id: 2, surname: 'Doe' };
-const teamMember3 = { givenName: 'Jack', id: 3, surname: 'White' };
+const teamMember2 = { givenName: 'Jane', id: 2, surname: 'Doe', status: 'active' };
+const teamMember3 = { givenName: 'Jack', id: 3, surname: 'White', status: 'pending' };
 const listPickerItems = [teamMember1, teamMember2, teamMember3];
 const listPickerInitialSelection = [teamMember2];
 const listPickerItemHeaders = {