fix(explorer): change how internal filters are detected (#3852)

apps/explorer/src/app/routes/oracles/components/oracle-details-type.spec.tsx

@@ -1,12 +1,13 @@
 import { render } from '@testing-library/react';
-import { OracleDetailsType } from './oracle-details-type';
-import type { SourceTypeName } from './oracle-details-type';
+import { OracleDetailsType, isInternalSourceType } from './oracle-details-type';
+import type { SourceType } from './oracle';
+import { PropertyKeyType } from '@vegaprotocol/types';
 
-function renderComponent(type: SourceTypeName) {
-  return <OracleDetailsType type={type} />;
+function renderComponent(type: SourceType) {
+  return <OracleDetailsType sourceType={type} />;
 }
 
-function renderWrappedComponent(type: SourceTypeName) {
+function renderWrappedComponent(type: SourceType) {
   return (
     <table>
       <tbody>{renderComponent(type)}</tbody>
@@ -14,19 +15,53 @@ function renderWrappedComponent(type: SourceTypeName) {
   );
 }
 
+function mock(name: string): SourceType {
+  return {
+    sourceType: {
+      filters: [
+        {
+          __typename: 'Filter',
+          key: {
+            name,
+            type: PropertyKeyType.TYPE_STRING,
+          },
+        },
+      ],
+    },
+  };
+}
+
 describe('Oracle type view', () => {
   it('Renders nothing when type is null', () => {
-    const res = render(renderComponent(null as unknown as SourceTypeName));
+    const res = render(renderComponent(null as unknown as SourceType));
     expect(res.container).toBeEmptyDOMElement();
   });
 
-  it('Renders Internal time for internal sources', () => {
-    const res = render(renderWrappedComponent('DataSourceDefinitionInternal'));
-    expect(res.getByText('Internal time')).toBeInTheDocument();
+  it('Renders Internal time for internal sources - timestamp', () => {
+    const s = mock('vegaprotocol.builtin.timestamp');
+    expect(isInternalSourceType(s)).toEqual(true);
+    const res = render(renderWrappedComponent(s));
+    expect(res.getByText('Internal data')).toBeInTheDocument();
+  });
+
+  it('Renders Internal time for internal sources - potential future types', () => {
+    const s = mock('vegaprotocol.builtin.boolean');
+    expect(isInternalSourceType(s)).toEqual(true);
+    const res = render(renderWrappedComponent(s));
+    expect(res.getByText('Internal data')).toBeInTheDocument();
+  });
+
+  it('Renders External data otherwise - prices.external.whatever', () => {
+    const s = mock('prices.external.whatever');
+    expect(isInternalSourceType(s)).toEqual(false);
+    const res = render(renderWrappedComponent(s));
+    expect(res.getByText('External data')).toBeInTheDocument();
   });
 
   it('Renders External data otherwise', () => {
-    const res = render(renderWrappedComponent('DataSourceDefinitionExternal'));
+    const s = mock('prices.external.vegaprotocol.builtin.');
+    expect(isInternalSourceType(s)).toEqual(false);
+    const res = render(renderWrappedComponent(s));
     expect(res.getByText('External data')).toBeInTheDocument();
   });
 });

apps/explorer/src/app/routes/oracles/components/oracle-details-type.tsx

@@ -1,27 +1,51 @@
 import { TableRow, TableCell, TableHeader } from '../../../components/table';
 import type { SourceType } from './oracle';
 
-export type SourceTypeName = SourceType['__typename'] | undefined;
+/**
+ * Basic function to determine if a source is internal or external.
+ *
+ * This should be distinguishable using __typename, but the type is incorrectly
+ * reported at the moment, so instead we check the filters.
+ *
+ * @param s SourceType
+ * @returns boolean True if the source is internal
+ */
+export function isInternalSourceType(s: SourceType) {
+  if ('filters' in s.sourceType) {
+    const filters = s.sourceType.filters;
+
+    if (filters) {
+      return (
+        filters?.filter((f) => {
+          return f.key.name?.indexOf('vegaprotocol.builtin.') === 0;
+        }).length > 0
+      );
+    }
+  }
+
+  return false;
+}
 
 interface OracleDetailsTypeProps {
-  type: SourceTypeName;
+  sourceType: SourceType;
 }
 
 /**
  * Renders a a single table row for the Oracle Details view that shows
  * if the oracle is using the internal time oracle or external data
  */
-export function OracleDetailsType({ type }: OracleDetailsTypeProps) {
-  if (!type) {
+export function OracleDetailsType({ sourceType }: OracleDetailsTypeProps) {
+  if (!sourceType) {
     return null;
   }
+
+  const isInternal = isInternalSourceType(sourceType);
+
   return (
     <TableRow modifier="bordered">
       <TableHeader scope="row">Type</TableHeader>
       <TableCell modifier="bordered">
-        {type === 'DataSourceDefinitionInternal'
-          ? 'Internal time'
-          : 'External data'}
+        {isInternal ? 'Internal data' : 'External data'}
       </TableCell>
     </TableRow>
   );

apps/explorer/src/app/routes/oracles/components/oracle.tsx

@@ -53,7 +53,7 @@ export const OracleDetails = ({
             <OracleLink id={id} />
           </TableCell>
         </TableRow>
-        <OracleDetailsType type={sourceType.__typename} />
+        <OracleDetailsType sourceType={sourceType} />
         <OracleSigners sourceType={sourceType} />
         <OracleMarkets id={id} />
         <TableRow modifier="bordered">