fix: Fixes #94 by adding missing filter for extrinsics timestamp (#165)

* refactor: Rename InputStorage key to method to be consistent with InputExtrinsic

* fix: Add filter to both section and method that considers isHidden prop

* refactor: Move into meaningful private functions

* fix: Fix linting errors

* test: Add Unit Tests to check shouldDisplaySection function

* fix: Remove unnecessary import

* restore file naming

* refactor: Move shouldDisplaySection into utils folder

* refactor: Move more common functionality into util

* remove unused isObject

* restore by removing unnecessary types. propose private type for storage

* fix: Remove explicit passing through the type for storage since its default

* feat: Use shared logic for showing section and methods in InputRpc

* refactor: Move shared types into util folder with section visibility type

* fix: type is public or private

* WIP: methods[name] TypeScript error

Element implicitly has an 'any' type because type '{}' has no index signature

* fix: Fix TSLint errors using jacos solution

packages/ui-app/src/InputExtrinsic/SelectMethod.tsx

@@ -5,7 +5,7 @@
 import { SectionItem } from '@polkadot/params/types';
 import { Extrinsics, Extrinsic$Sections } from '@polkadot/extrinsics/types';
 import { I18nProps } from '../types';
-import { DropdownOptions } from './types';
+import { DropdownOptions, SectionVisibilityAll } from '../util/types';
 
 import React from 'react';
 
@@ -20,7 +20,7 @@ type Props = I18nProps & {
   label?: string,
   onChange: (value: SectionItem<Extrinsics>) => void,
   options: DropdownOptions,
-  type: 'private' | 'public',
+  type: SectionVisibilityAll,
   value: SectionItem<Extrinsics>,
   withLabel?: boolean
 };

packages/ui-app/src/InputExtrinsic/SelectSection.tsx

@@ -5,7 +5,7 @@
 import { SectionItem } from '@polkadot/params/types';
 import { Extrinsics, Extrinsic$Sections } from '@polkadot/extrinsics/types';
 import { I18nProps } from '../types';
-import { DropdownOptions } from './types';
+import { DropdownOptions } from '../util/types';
 
 import React from 'react';
 

packages/ui-app/src/InputExtrinsic/index.tsx

@@ -7,7 +7,7 @@
 import { SectionItem } from '@polkadot/params/types';
 import { Extrinsics, Extrinsic$Sections } from '@polkadot/extrinsics/types';
 import { I18nProps } from '../types';
-import { DropdownOptions } from './types';
+import { DropdownOptions, SectionVisibilityAll } from '../util/types';
 
 import './InputExtrinsic.css';
 
@@ -35,7 +35,7 @@ type Props = I18nProps & {
 type State = {
   optionsMethod: DropdownOptions,
   optionsSection: DropdownOptions,
-  type: 'private' | 'public',
+  type: SectionVisibilityAll,
   value: SectionItem<Extrinsics>
 };
 

packages/ui-app/src/InputExtrinsic/options/method.tsx

@@ -3,13 +3,13 @@
 // of the ISC license. See the LICENSE file for details.
 
 import { Extrinsic$Sections } from '@polkadot/extrinsics/types';
-import { DropdownOptions } from '../types';
+import { DropdownOptions, SectionVisibilityAll } from '../../util/types';
 
 import React from 'react';
 
 import map from '@polkadot/extrinsics';
 
-export default function createOptions (sectionName: Extrinsic$Sections, type: 'private' | 'public'): DropdownOptions {
+export default function createOptions (sectionName: Extrinsic$Sections, type: SectionVisibilityAll): DropdownOptions {
   const section = map[sectionName];
 
   if (!section) {
@@ -21,6 +21,11 @@ export default function createOptions (sectionName: Extrinsic$Sections, type: 'p
   return Object
     .keys(methods)
     .sort()
+    .filter((name) => {
+      const { isDeprecated, isHidden } = methods[name];
+
+      return !isDeprecated && !isHidden;
+    })
     .map((name) => {
       const { description, params } = methods[name];
       const inputs = params.map(({ name }) => name).join(', ');

packages/ui-app/src/InputExtrinsic/options/section.ts

@@ -3,26 +3,19 @@
 // of the ISC license. See the LICENSE file for details.
 
 import { Extrinsic$Sections } from '@polkadot/extrinsics/types';
-
-import { DropdownOptions } from '../types';
+import { DropdownOptions, SectionVisibilityAll } from '../../util/types';
+import { shouldDisplaySection } from '../../util/shouldDisplaySection';
 
 import map from '@polkadot/extrinsics';
 
-export default function createOptions (type: 'private' | 'public'): DropdownOptions {
+export default function createOptions (type: SectionVisibilityAll): DropdownOptions {
   return Object
     .keys(map)
     .sort()
     .filter((name) => {
       const section = map[name as Extrinsic$Sections];
 
-      // cannot really get here
-      if (!section) {
-        return false;
-      }
-
-      const methods = section[type];
-
-      return Object.keys(methods).length !== 0;
+      return shouldDisplaySection(section, type);
     })
     .map((name) => ({
       text: name,

packages/ui-app/src/InputRpc/SelectMethod.tsx

@@ -4,7 +4,7 @@
 
 import { SectionItem } from '@polkadot/params/types';
 import { Interfaces, Interface$Sections } from '@polkadot/jsonrpc/types';
-import { DropdownOptions } from '../InputExtrinsic/types';
+import { DropdownOptions } from '../util/types';
 import { I18nProps } from '../types';
 
 import React from 'react';

packages/ui-app/src/InputRpc/SelectSection.tsx

@@ -4,7 +4,7 @@
 
 import { SectionItem } from '@polkadot/params/types';
 import { Interfaces, Interface$Sections } from '@polkadot/jsonrpc/types';
-import { DropdownOptions } from '../InputExtrinsic/types';
+import { DropdownOptions } from '../util/types';
 import { I18nProps } from '../types';
 
 import React from 'react';

packages/ui-app/src/InputRpc/index.tsx

@@ -6,7 +6,7 @@
 
 import { SectionItem } from '@polkadot/params/types';
 import { Interfaces, Interface$Sections } from '@polkadot/jsonrpc/types';
-import { DropdownOptions } from '../InputExtrinsic/types';
+import { DropdownOptions } from '../util/types';
 import { I18nProps } from '../types';
 
 import '../InputExtrinsic/InputExtrinsic.css';

packages/ui-app/src/InputRpc/options/method.tsx

@@ -3,7 +3,7 @@
 // of the ISC license. See the LICENSE file for details.
 
 import { Interface$Sections } from '@polkadot/jsonrpc/types';
-import { DropdownOptions } from '../../InputExtrinsic/types';
+import { DropdownOptions } from '../../util/types';
 
 import React from 'react';
 

packages/ui-app/src/InputRpc/options/section.ts

@@ -3,8 +3,8 @@
 // of the ISC license. See the LICENSE file for details.
 
 import { Interface$Sections } from '@polkadot/jsonrpc/types';
-
-import { DropdownOptions } from '../../InputExtrinsic/types';
+import { DropdownOptions } from '../../util/types';
+import { shouldDisplaySection } from '../../util/shouldDisplaySection';
 
 import map from '@polkadot/jsonrpc';
 
@@ -15,21 +15,7 @@ export default function createOptions (): DropdownOptions {
     .filter((name) => {
       const section = map[name as Interface$Sections];
 
-      // cannot really get here
-      if (!section) {
-        return false;
-      }
-
-      const { isDeprecated } = section;
-      const available = Object
-        .keys(section.public)
-        .filter((name) => {
-          const { isDeprecated, isHidden } = section.public[name];
-
-          return !isDeprecated && !isHidden;
-        });
-
-      return !isDeprecated && available.length !== 0;
+      return shouldDisplaySection(section, 'public');
     })
     .map((name) => ({
       text: name,

packages/ui-app/src/InputStorage/SelectKey.tsx

@@ -4,7 +4,7 @@
 
 import { SectionItem } from '@polkadot/params/types';
 import { Storages } from '@polkadot/storage/types';
-import { DropdownOptions } from '../InputExtrinsic/types';
+import { DropdownOptions } from '../util/types';
 import { I18nProps } from '../types';
 
 import React from 'react';

packages/ui-app/src/InputStorage/SelectSection.tsx

@@ -4,7 +4,7 @@
 
 import { SectionItem } from '@polkadot/params/types';
 import { Storages, Storage$Sections } from '@polkadot/storage/types';
-import { DropdownOptions } from '../InputExtrinsic/types';
+import { DropdownOptions } from '../util/types';
 import { I18nProps } from '../types';
 
 import React from 'react';

packages/ui-app/src/InputStorage/index.tsx

@@ -6,7 +6,7 @@
 
 import { SectionItem } from '@polkadot/params/types';
 import { Storages, Storage$Sections } from '@polkadot/storage/types';
-import { DropdownOptions } from '../InputExtrinsic/types';
+import { DropdownOptions } from '../util/types';
 import { I18nProps } from '../types';
 
 import '../InputExtrinsic/InputExtrinsic.css';

packages/ui-app/src/InputStorage/options/key.tsx

@@ -3,7 +3,7 @@
 // of the ISC license. See the LICENSE file for details.
 
 import { Storage$Sections } from '@polkadot/storage/types';
-import { DropdownOptions } from '../../InputExtrinsic/types';
+import { DropdownOptions } from '../../util/types';
 
 import React from 'react';
 

packages/ui-app/src/InputStorage/options/section.ts

@@ -3,7 +3,9 @@
 // of the ISC license. See the LICENSE file for details.
 
 import { Storage$Sections } from '@polkadot/storage/types';
-import { DropdownOptions } from '../../InputExtrinsic/types';
+import { DropdownOptions } from '../../util/types';
+
+import { shouldDisplaySection } from '../../util/shouldDisplaySection';
 
 import map from '@polkadot/storage';
 
@@ -14,20 +16,7 @@ export default function createOptions (): DropdownOptions {
     .filter((name) => {
       const section = map[name as Storage$Sections];
 
-      // cannot really get here
-      if (!section) {
-        return false;
-      }
-
-      const methods = Object
-        .keys(section.public)
-        .filter((name) => {
-          const { isDeprecated, isHidden } = section.public[name];
-
-          return !isDeprecated && !isHidden;
-        });
-
-      return !section.isDeprecated && methods.length !== 0;
+      return shouldDisplaySection(section, 'public');
     })
     .map((name) => ({
       text: name,

packages/ui-app/src/util/shouldDisplaySection.spec.js

@@ -0,0 +1,75 @@
+// Copyright 2017-2018 @polkadot/ui-app authors & contributors
+// This software may be modified and distributed under the terms
+// of the ISC license. See the LICENSE file for details.
+
+import { shouldDisplaySection } from './shouldDisplaySection';
+
+describe('input extrinsic section', () => {
+  let type, dummySection;
+
+  beforeEach(() => {
+    type = 'public';
+
+    dummySection = {
+      name: 'dummy',
+      description: 'an dummy extrinsic section',
+      isDeprecated: false,
+      isHidden: false,
+      private: {},
+      public: {
+        didUpdate: {
+          isDeprecated: false,
+          isHidden: false
+        }
+      }
+    }
+  });
+
+  it('will be shown if section and its associated methods are not deprecated or hidden', () => {
+    const expectedOutput = true;
+    const actualOutput = shouldDisplaySection(dummySection, type);
+
+    expect(actualOutput).toEqual(expectedOutput);
+  });
+
+  it('will not be shown if section is hidden', () => {
+    dummySection['isHidden'] = true; 
+    const expectedOutput = false;
+    const actualOutput = shouldDisplaySection(dummySection, type);
+
+    expect(actualOutput).toEqual(expectedOutput);
+  });
+
+  it('will not be shown if section is deprecated', () => {
+    dummySection['isDeprecated'] = true; 
+    const expectedOutput = false;
+    const actualOutput = shouldDisplaySection(dummySection, type);
+
+    expect(actualOutput).toEqual(expectedOutput);
+  });
+
+  it('will not be shown if section is not deprecated or hidden and no associated methods exist', () => {
+    type = 'private';
+    const expectedOutput = false;
+    const actualOutput = shouldDisplaySection(dummySection, type);
+
+    expect(actualOutput).toEqual(expectedOutput);
+  });
+
+  it('will not be shown if section is not deprecated or hidden but an associated method is deprecated or hidden', () => {
+    dummySection['public']['didUpdate']['isHidden'] = true;
+    const expectedOutput = false;
+    const actualOutput = shouldDisplaySection(dummySection, type);
+
+    expect(actualOutput).toEqual(expectedOutput);
+  });
+
+  it('will not be shown if section methods are undefined or not an object', () => {
+    type = 'non-existant-type';
+    const expectedOutput = false;
+    const actualOutput = shouldDisplaySection(dummySection, type);
+
+    expect(actualOutput).toEqual(expectedOutput);
+  });
+
+});

packages/ui-app/src/util/shouldDisplaySection.ts

@@ -0,0 +1,34 @@
+// Copyright 2017-2018 @polkadot/ui-app authors & contributors
+// This software may be modified and distributed under the terms
+// of the ISC license. See the LICENSE file for details.
+
+import { Section, SectionItems } from '@polkadot/params/types';
+import { SectionVisibilityAll } from '../util/types';
+
+import isUndefined from '@polkadot/util/is/undefined';
+import isNull from '@polkadot/util/is/null';
+
+function anyMethodToDisplay <T> (methods: SectionItems<T>) {
+  if (isUndefined(methods) || isNull(methods)) {
+    return false;
+  }
+
+  return Object
+    .keys(methods)
+    .filter((name) => {
+      const { isDeprecated, isHidden } = methods[name];
+
+      return !isDeprecated && !isHidden;
+    })
+    .length !== 0;
+}
+
+export function shouldDisplaySection<T> (section: Section<T>, type: SectionVisibilityAll) {
+  if (isUndefined(section)) {
+    return false;
+  }
+
+  const methods = section[type];
+
+  return !section.isDeprecated && !section.isHidden && anyMethodToDisplay(methods);
+}

packages/ui-app/src/util/types.d.ts

@@ -10,3 +10,5 @@ export type DropdownOption = {
 };
 
 export type DropdownOptions = Array<DropdownOption>;
+
+export type SectionVisibilityAll = 'private' | 'public';