Calling: Lobby

ts/components/CallingPip.stories.tsx

@@ -15,6 +15,7 @@ const callDetails = {
   isIncoming: true,
   isVideoCall: true,
 
+  id: '3051234567',
   avatarPath: undefined,
   color: 'ultramarine' as ColorType,
   title: 'Rick Sanchez',
@@ -24,7 +25,7 @@ const callDetails = {
 };
 
 const createProps = (overrideProps: Partial<PropsType> = {}): PropsType => ({
-  callDetails,
+  callDetails: overrideProps.callDetails || callDetails,
   hangUp: action('hang-up'),
   hasLocalVideo: boolean('hasLocalVideo', overrideProps.hasLocalVideo || false),
   hasRemoteVideo: boolean(
@@ -43,3 +44,23 @@ story.add('Default', () => {
   const props = createProps();
   return <CallingPip {...props} />;
 });
+
+story.add('Contact (with avatar)', () => {
+  const props = createProps({
+    callDetails: {
+      ...callDetails,
+      avatarPath: 'https://www.fillmurray.com/64/64',
+    },
+  });
+  return <CallingPip {...props} />;
+});
+
+story.add('Contact (no color)', () => {
+  const props = createProps({
+    callDetails: {
+      ...callDetails,
+      color: undefined,
+    },
+  });
+  return <CallingPip {...props} />;
+});