refactor(overmind-devtools): improve size indiation of arrays and objects

christianalfoni · christianalfoni · commit 1649a6adb601 · 2018-12-30T16:09:43.000+01:00
diff --git a/packages/node_modules/overmind-devtools/src/components/Inspector/index.tsx b/packages/node_modules/overmind-devtools/src/components/Inspector/index.tsx
@@ -38,7 +38,12 @@ const Nested: SFC<NestedProps> = ({
         {path.length ? (
           <span className={styles.key}>{path[path.length - 1]}:</span>
         ) : null}
-        {startBracket} {isArray ? keys.length : keys.slice(0, 3).join(', ')}{' '}
+        {startBracket}
+        <span className={styles.keyCount}>
+          {isArray
+            ? keys.length + ' items'
+            : keys.slice(0, 3).join(', ') + '...'}
+        </span>
         {endBracket}
       </div>
     )
diff --git a/packages/node_modules/overmind-devtools/src/components/Inspector/styles.ts b/packages/node_modules/overmind-devtools/src/components/Inspector/styles.ts
@@ -36,3 +36,8 @@ export const genericValue = css`
 export const nestedChildren = css`
   padding-left: 1rem;
 `
+
+export const keyCount = css`
+  font-size: var(--font-size-2);
+  color: var(--color-white-4);
+`

Original file line number	Diff line number	Diff line change
@@ -36,3 +36,8 @@ export const genericValue = css`
`36`	`36`	export const nestedChildren = css`
`37`	`37`	`padding-left: 1rem;`
`38`	`38`	`
	`39`	`+`
	`40`	+export const keyCount = css`
	`41`	`+ font-size: var(--font-size-2);`
	`42`	`+ color: var(--color-white-4);`
	`43`	+`