@procivis/one-react-native-components 0.1.63 → 0.2.54

package/src/ui-components/searchbar/search-bar.tsx

@@ -0,0 +1,94 @@
+import React, { forwardRef, useCallback } from 'react';
+import { Insets, Platform, StyleProp, StyleSheet, TextInput, TextInputProps, View, ViewStyle } from 'react-native';
+
+import { concatTestID } from '../../utils';
+import { TouchableOpacity } from '../accessibility';
+import { CloseIcon, SearchIcon } from '../icons';
+import font from '../text/font';
+import { useAppColorScheme } from '../theme';
+
+export interface SearchBarProps extends TextInputProps {
+  style?: StyleProp<ViewStyle>;
+  placeholder?: string;
+  searchPhrase: string;
+  onSearchPhraseChange: (searchPhrase: string) => void;
+}
+
+const hitSlop: Insets = { top: 10, left: 10, bottom: 10, right: 10 };
+
+// https://www.figma.com/file/52qDYWUMjXAGre1dcnz5bz/Procivis-One-Wallet?node-id=1143-40433&t=HY1KvobxOReLeC8Z-4
+const SearchBar = forwardRef<TextInput, SearchBarProps>(
+  ({ style, placeholder, searchPhrase, onSearchPhraseChange, testID, ...textInputProps }, ref) => {
+    const colorScheme = useAppColorScheme();
+
+    const onClear = useCallback(() => {
+      onSearchPhraseChange('');
+    }, [onSearchPhraseChange]);
+
+    return (
+      <View
+        style={[
+          styles.container,
+          {
+            backgroundColor: colorScheme.white,
+          },
+          style,
+        ]}>
+        <SearchIcon color={colorScheme.text} style={styles.searchIcon} />
+        <TextInput
+          accessibilityRole="search"
+          onChangeText={onSearchPhraseChange}
+          placeholder={placeholder}
+          placeholderTextColor={colorScheme.text}
+          ref={ref}
+          returnKeyType="search"
+          style={[styles.textInput, { color: colorScheme.text }]}
+          value={searchPhrase}
+          testID={testID}
+          {...textInputProps}
+        />
+        {searchPhrase && (
+          <TouchableOpacity
+            testID={concatTestID(testID, 'clear')}
+            accessibilityRole="button"
+            hitSlop={hitSlop}
+            onPress={onClear}
+            style={styles.clearButton}>
+            <CloseIcon color={colorScheme.text} height={12} width={12} />
+          </TouchableOpacity>
+        )}
+      </View>
+    );
+  },
+);
+
+SearchBar.displayName = 'SearchBar';
+
+const styles = StyleSheet.create({
+  clearButton: {
+    marginLeft: 6,
+    marginRight: 16,
+  },
+  container: {
+    alignItems: 'center',
+    borderRadius: 20,
+    borderWidth: 0,
+    flexDirection: 'row',
+    height: 40,
+  },
+  searchIcon: {
+    marginLeft: 8,
+    marginRight: 6,
+  },
+  textInput: {
+    ...font.regular,
+    flex: 1,
+    fontSize: 14,
+    height: 40,
+    letterSpacing: 0.2,
+    lineHeight: 18,
+    paddingBottom: Platform.OS === 'ios' ? 2 : undefined,
+  },
+});
+
+export default SearchBar;

package/src/ui-components/text/typography.stories.tsx

@@ -0,0 +1,70 @@
+import type { ComponentMeta, ComponentStory } from '@storybook/react';
+import React from 'react';
+import type { ColorValue } from 'react-native';
+
+import ColorSchemes from '../../../storybook/colorScheme';
+import { ColorScheme, useAppColorScheme } from '../theme';
+import Typography from './typography';
+
+type ColorSchemeKey = keyof Omit<ColorScheme, 'darkMode'>;
+
+const Basic: ComponentStory<typeof Typography> = ({ color, ...args }) => {
+  const colorScheme = useAppColorScheme();
+  return <Typography {...args} color={colorScheme[color as ColorSchemeKey] as ColorValue} />;
+};
+
+Basic.args = {
+  children: 'Text',
+  preset: 'regular',
+  caps: false,
+  color: 'text',
+  align: 'left',
+  numberOfLines: 1,
+  ellipsizeMode: 'tail',
+};
+
+export { Basic as Typography };
+
+export default {
+  title: 'base/Typography',
+  component: Typography,
+  argTypes: {
+    preset: {
+      options: [
+        'xl',
+        'l',
+        'l/line-height-large',
+        'regular',
+        'm',
+        's',
+        's/line-height-capped',
+        's/line-height-small',
+        's/code',
+        'xs',
+        'xs/line-height-small',
+        'xs/code',
+      ],
+      control: { type: 'radio' },
+    },
+    color: {
+      options: Object.entries(ColorSchemes.procivis)
+        .filter(([_, value]) => typeof value === 'string')
+        .map(([key]) => key),
+      control: { type: 'select' },
+    },
+    align: {
+      options: ['left', 'center', 'right'],
+      control: { type: 'radio' },
+    },
+    ellipsizeMode: {
+      options: ['head', 'middle', 'tail', 'clip'],
+      control: { type: 'select' },
+    },
+  },
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/file/52qDYWUMjXAGre1dcnz5bz/Procivis-One-Wallet?node-id=1045-30326',
+    },
+  },
+} as ComponentMeta<typeof Typography>;

package/src/utils/array.ts

@@ -0,0 +1,3 @@
+export function addElementIf<T>(condition: boolean, obj: T) {
+  return condition ? Array(obj) : [];
+}

package/src/utils/backup.ts

@@ -0,0 +1,5 @@
+import { generateUUID } from './uuid';
+
+export const getBackupFileName = (): string => {
+  return `procivis-one-backup-${generateUUID()}.zip`;
+};

package/src/utils/date.ts

@@ -1,6 +1,10 @@
 // Date & Time formatted as specified in SW-610
 
-import { NativeModules } from 'react-native';
+import { NativeModules, Platform } from 'react-native';
+import { format } from 'timeago.js';
+
+const MINUTE = 60 * 1000;
+const DAY = 24 * 60 * MINUTE;
 
 // OS locale
 const systemLocale: string = NativeModules.I18nManager?.localeIdentifier
@@ -47,3 +51,103 @@ export const formatDateTime = (date: Date, locale?: string) => {
     return undefined;
   }
 };
+
+/**
+ * Month format
+ */
+export const formatMonth = (date: Date, locale: string): string => {
+  return `${date.toLocaleString(locale, {
+    month: 'long',
+  })} ${date.getFullYear()}`;
+};
+
+/**
+ * Time-ago format
+ */
+export const formatTimeAgo = (date: Date, locale: string): string => {
+  return format(date, locale);
+};
+
+/**
+ * Timestamp formatted for general use
+ */
+export const formatTimestamp = (date: Date, locale: string, nowLabel: string): string => {
+  const now = Date.now();
+  const timestamp = date.getTime();
+  if (now < timestamp) {
+    // in the future
+    return formatDateTime(date, locale) ?? '';
+  }
+
+  // in the past
+  if (now - timestamp < MINUTE) {
+    // less than a minute ago
+    return nowLabel;
+  }
+
+  // less than a day ago
+  if (now - timestamp < DAY) {
+    return formatTimeAgo(date, locale);
+  }
+
+  // longer ago
+  return formatDateTime(date, locale) ?? '';
+};
+
+const pad = (x: number) => (x >= 0 && x < 10 ? `0${x}` : String(x));
+
+/**
+ * Utility function to deal with `date`-type attributes
+ * @param {Date} date local timezone representation
+ * @returns {number} the same day, but UTC timezone with midnight time
+ */
+export const convertDateToUTCTimestamp = (date: Date): number =>
+  Date.parse(`${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`);
+
+/**
+ * Utility function to deal with `date`-type attributes
+ * @param {string} date in YYYY-MM-DD representation
+ * @returns {Date} the same day, but local timezone with midnight time
+ */
+export const convertDateStrToLocalDate = (date: string): Date =>
+  Platform.select({
+    // android conversion using the standard date parsing doesn't work, computing the timestamp manually
+    android: (() => {
+      const timestamp = Date.parse(date);
+      const timezoneOffset = new Date(date).getTimezoneOffset();
+      return new Date(timestamp + timezoneOffset * MINUTE);
+    })(),
+    default: new Date(`${date}T00:00:00`),
+  });
+
+/**
+ * Inverted function to {@link convertDateToUTCTimestamp}
+ * @param {number} utcTimestamp date timestamp represented as midnight UTC time
+ * @returns {string} formatted date (based on locale settings, e.g. `21/02/2021`)
+ */
+export const formatDateOnlyFromUTCTimestamp = (utcTimestamp: number): string => {
+  const utcDate = new Date(utcTimestamp);
+  return (
+    formatDate(
+      convertDateStrToLocalDate(
+        `${utcDate.getUTCFullYear()}-${pad(utcDate.getUTCMonth() + 1)}-${pad(utcDate.getUTCDate())}`,
+      ),
+    ) ?? ''
+  );
+};
+
+const locale = (
+  Platform.OS === 'ios'
+    ? NativeModules.SettingsManager.settings.AppleLocale
+    : NativeModules.I18nManager.localeIdentifier
+)
+  .split('@')[0]
+  .replace('_', '-');
+
+export const formatDateTimeLocalized = (date: Date) => {
+  return formatDateTime(date, locale);
+};
+
+export const formatDateLocalized = (date: Date) => {
+  return formatDate(date, locale);
+};

package/src/utils/hooks/connectivity/connectivity.test.ts

@@ -0,0 +1,87 @@
+import { getInvitationUrlTransports, Transport } from './connectivity';
+
+jest.mock('@react-native-community/netinfo', () => ({
+  addEventListener: () => {},
+}));
+
+jest.mock('react-native-bluetooth-state-manager', () => ({
+  onStateChange: () => {},
+}));
+
+describe('getInvitationUrlTransports', () => {
+  test('BLE OpenID4VP url', () => {
+    const transports = getInvitationUrlTransports(
+      'OPENID4VP://connect?name=XFwsduA5&key=24c810cb01a8b12200bdb66dc5a7ac9b49a4cfdd5c4b89f51e03206be3abac5b',
+      'mdoc-openid4vp',
+    );
+    expect(transports).toStrictEqual([Transport.Bluetooth]);
+  });
+  test('MQTT OpenID4VP url', () => {
+    const transports = getInvitationUrlTransports(
+      'OPENID4VP://connect?key=24c810cb01a8b12200bdb66dc5a7ac9b49a4cfdd5c4b89f51e03206be3abac5b&brokerUrl=mqtt://dev.procivis-one.com&topicId=540684a4-430c-441c-b188-786653f5ab35',
+      'mdoc-openid4vp',
+    );
+    expect(transports).toStrictEqual([Transport.MQTT]);
+  });
+  test('Mixed BLE/MQTT OpenID4VP url', () => {
+    const transports = getInvitationUrlTransports(
+      'OPENID4VP://connect?name=XFwsduA5&key=24c810cb01a8b12200bdb66dc5a7ac9b49a4cfdd5c4b89f51e03206be3abac5b&brokerUrl=mqtt://dev.procivis-one.com&topicId=540684a4-430c-441c-b188-786653f5ab35',
+      'mdoc-openid4vp',
+    );
+    expect(transports).toStrictEqual([Transport.Bluetooth, Transport.MQTT]);
+  });
+  test('BLE OpenID4VP url with custom scheme', () => {
+    const transports = getInvitationUrlTransports(
+      'MDOC-OPENID4VP://connect?name=XFwsduA5&key=24c810cb01a8b12200bdb66dc5a7ac9b49a4cfdd5c4b89f51e03206be3abac5b',
+      'mdoc-openid4vp',
+    );
+    expect(transports).toStrictEqual([Transport.Bluetooth]);
+  });
+  test('MQTT OpenID4VP url with custom scheme', () => {
+    const transports = getInvitationUrlTransports(
+      'MDOC-OPENID4VP://connect?key=24c810cb01a8b12200bdb66dc5a7ac9b49a4cfdd5c4b89f51e03206be3abac5b&brokerUrl=mqtt://dev.procivis-one.com&topicId=540684a4-430c-441c-b188-786653f5ab35',
+      'mdoc-openid4vp',
+    );
+    expect(transports).toStrictEqual([Transport.MQTT]);
+  });
+  test('Mixed BLE/MQTT OpenID4VP url with custom scheme', () => {
+    const transports = getInvitationUrlTransports(
+      'MDOC-OPENID4VP://connect?name=XFwsduA5&key=24c810cb01a8b12200bdb66dc5a7ac9b49a4cfdd5c4b89f51e03206be3abac5b&brokerUrl=mqtt://dev.procivis-one.com&topicId=540684a4-430c-441c-b188-786653f5ab35',
+      'mdoc-openid4vp',
+    );
+    expect(transports).toStrictEqual([Transport.Bluetooth, Transport.MQTT]);
+  });
+  test('HTTP OpenID4VP url', () => {
+    const transports = getInvitationUrlTransports(
+      'openid4vp://?response_type=vp_token&state=25fdb134-487d-4bcd-9fdf-777e7f74f128&nonce=DZE2qP6FaDksHxkfOdYJC1LWgVyf5Ibc&client_id_scheme=redirect_uri&client_id=https%3A%2F%2Fcore.dev.procivis-one.com%2Fssi%2Foidc-verifier%2Fv1%2Fresponse&response_mode=direct_post&response_uri=https%3A%2F%2Fcore.dev.procivis-one.com%2Fssi%2Foidc-verifier%2Fv1%2Fresponse&client_metadata_uri=https%3A%2F%2Fcore.dev.procivis-one.com%2Fssi%2Foidc-verifier%2Fv1%2F89973de1-75ba-4367-89ef-4d928de88933%2Fclient-metadata&presentation_definition_uri=https%3A%2F%2Fcore.dev.procivis-one.com%2Fssi%2Foidc-verifier%2Fv1%2F89973de1-75ba-4367-89ef-4d928de88933%2Fpresentation-definition',
+      'mdoc-openid4vp',
+    );
+    expect(transports).toStrictEqual([Transport.HTTP]);
+  });
+  test('HTTP OpenID4VP url with custom scheme', () => {
+    const transports = getInvitationUrlTransports(
+      'mdoc-openid4vp://?response_type=vp_token&state=25fdb134-487d-4bcd-9fdf-777e7f74f128&nonce=DZE2qP6FaDksHxkfOdYJC1LWgVyf5Ibc&client_id_scheme=redirect_uri&client_id=https%3A%2F%2Fcore.dev.procivis-one.com%2Fssi%2Foidc-verifier%2Fv1%2Fresponse&response_mode=direct_post&response_uri=https%3A%2F%2Fcore.dev.procivis-one.com%2Fssi%2Foidc-verifier%2Fv1%2Fresponse&client_metadata_uri=https%3A%2F%2Fcore.dev.procivis-one.com%2Fssi%2Foidc-verifier%2Fv1%2F89973de1-75ba-4367-89ef-4d928de88933%2Fclient-metadata&presentation_definition_uri=https%3A%2F%2Fcore.dev.procivis-one.com%2Fssi%2Foidc-verifier%2Fv1%2F89973de1-75ba-4367-89ef-4d928de88933%2Fpresentation-definition',
+      'mdoc-openid4vp',
+    );
+    expect(transports).toStrictEqual([Transport.HTTP]);
+  });
+  test('HTTP OpenID4VP url with requestUri', () => {
+    const transports = getInvitationUrlTransports(
+      'openid4vp://?client_id=https%3A%2F%2Fcore.dev.procivis-one.com%2Fssi%2Foidc-verifier%2Fv1%2Fresponse&request_uri=https%3A%2F%2Fcore.dev.procivis-one.com%2Fssi%2Foidc-verifier%2Fv1%2F6e442f9d-bc14-4362-8786-504d7b79c402%2Fclient-request',
+      'mdoc-openid4vp',
+    );
+    expect(transports).toStrictEqual([Transport.HTTP]);
+  });
+  test('HTTP OpenID credential offer url', () => {
+    const transports = getInvitationUrlTransports(
+      'openid-credential-offer://?credential_offer_uri=https%3A%2F%2Fcore.dev.procivis-one.com%2Fssi%2Foidc-issuer%2Fv1%2F0c2cd9a6-1eff-4536-9505-98d7bd87aad1%2Foffer%2F275c09b2-4f4f-4738-85fc-35399acad176',
+      'mdoc-openid4vp',
+    );
+    expect(transports).toStrictEqual([Transport.HTTP]);
+  });
+
+  test('Invalid link', () => {
+    const transports = getInvitationUrlTransports('invalid');
+    expect(transports).toStrictEqual([]);
+  });
+});

package/src/utils/hooks/connectivity/connectivity.ts

@@ -0,0 +1,162 @@
+import {
+  addEventListener as onNetworkStateChange,
+  NetInfoStateType,
+  NetInfoSubscription,
+} from '@react-native-community/netinfo';
+import parseUrl from 'parse-url';
+import { useEffect, useMemo, useState } from 'react';
+import { EventSubscription } from 'react-native';
+import BTStateManager from 'react-native-bluetooth-state-manager';
+
+export enum InternetState {
+  Available,
+  Unreachable,
+  Disabled,
+}
+
+export type InternetError = Exclude<InternetState, InternetState.Available>;
+
+export enum BluetoothState {
+  Available,
+  Unauthorized,
+  Disabled,
+  Unavailable,
+}
+
+export type BluetoothError = Exclude<BluetoothState, BluetoothState.Available>;
+
+export enum Transport {
+  Bluetooth = 'BLE',
+  HTTP = 'HTTP',
+  MQTT = 'MQTT',
+}
+
+export type TransportError = {
+  ble?: BluetoothError;
+  internet?: InternetError;
+};
+
+export const useAvailableTransports = (
+  supportedTransports: Transport[],
+): {
+  availableTransport: Transport[] | undefined;
+  transportError: TransportError;
+} => {
+  const [internetState, setInternetState] = useState<InternetState>();
+  const [bluetoothState, setBluetoothState] = useState<BluetoothState>();
+
+  useEffect(() => {
+    let btSubscription: EventSubscription | undefined;
+    if (supportedTransports.includes(Transport.Bluetooth)) {
+      btSubscription = BTStateManager.onStateChange((state) => {
+        switch (state) {
+          case 'PoweredOn':
+            setBluetoothState(BluetoothState.Available);
+            break;
+          case 'PoweredOff':
+            setBluetoothState(BluetoothState.Disabled);
+            break;
+          case 'Unauthorized':
+            setBluetoothState(BluetoothState.Unauthorized);
+            break;
+          default:
+            setBluetoothState(BluetoothState.Unavailable);
+        }
+      }, true);
+    }
+    let netSubscription: NetInfoSubscription | undefined;
+    if (supportedTransports.includes(Transport.HTTP) || supportedTransports.includes(Transport.MQTT)) {
+      netSubscription = onNetworkStateChange((state) => {
+        if (state.type === NetInfoStateType.none) {
+          setInternetState(InternetState.Disabled);
+          return;
+        }
+        if (state.isInternetReachable === null) {
+          return;
+        }
+        if (state.isInternetReachable) {
+          setInternetState(InternetState.Available);
+        } else {
+          setInternetState(InternetState.Unreachable);
+        }
+      });
+    }
+    return () => {
+      btSubscription?.remove();
+      netSubscription?.();
+    };
+  }, [supportedTransports]);
+
+  const transportStatus = useMemo(() => {
+    const waitingForInternetState =
+      (supportedTransports.includes(Transport.HTTP) || supportedTransports.includes(Transport.MQTT)) &&
+      internetState === undefined;
+    const waitingForBluetoothState = supportedTransports.includes(Transport.Bluetooth) && bluetoothState === undefined;
+    if (waitingForInternetState || waitingForBluetoothState) {
+      return {
+        availableTransport: undefined,
+        transportError: {},
+      };
+    }
+    const availableTransport: Transport[] = [];
+    const transportError: TransportError = {};
+    if (internetState === InternetState.Available) {
+      availableTransport.push(Transport.MQTT);
+      availableTransport.push(Transport.HTTP);
+    } else {
+      transportError.internet = internetState;
+    }
+    if (bluetoothState === BluetoothState.Available) {
+      availableTransport.push(Transport.Bluetooth);
+    } else {
+      transportError.ble = bluetoothState;
+    }
+    return { availableTransport, transportError };
+  }, [bluetoothState, internetState, supportedTransports]);
+
+  return transportStatus;
+};
+
+export const getInvitationUrlTransports = (url: string, customOpenIdUrlScheme?: string): Transport[] => {
+  let parsedUrl: parseUrl.ParsedUrl;
+  try {
+    parsedUrl = parseUrl(url);
+  } catch (e) {
+    return [];
+  }
+
+  if (parsedUrl.parse_failed) {
+    return [];
+  }
+  const protocol = parsedUrl.protocol as string;
+  if (protocol !== 'openid4vp' && protocol !== customOpenIdUrlScheme?.toLowerCase()) {
+    return [Transport.HTTP];
+  }
+
+  const query = parsedUrl.query as Record<string, string>;
+  const hasAllParameters = (...params: string[]): boolean => {
+    return params.every((param) => param in query);
+  };
+
+  const transports: Transport[] = [];
+  // BLE/MQTT
+  if (parsedUrl.host === 'connect') {
+    if (hasAllParameters('name', 'key')) {
+      transports.push(Transport.Bluetooth);
+    }
+    if (hasAllParameters('key', 'brokerUrl', 'topicId')) {
+      transports.push(Transport.MQTT);
+    }
+
+    return transports;
+  }
+  // HTTP
+  if (
+    hasAllParameters('response_type', 'state', 'nonce', 'presentation_definition_uri') ||
+    hasAllParameters('client_id', 'request_uri')
+  ) {
+    transports.push(Transport.HTTP);
+  }
+
+  return transports;
+};

package/src/utils/hooks/core/backup.ts

@@ -0,0 +1,140 @@
+import { DidTypeEnum, OneError } from '@procivis/react-native-one-core';
+import { useCallback } from 'react';
+import { useMutation, useQuery, useQueryClient } from 'react-query';
+
+import { generateUUID } from '../../uuid';
+import { useONECore } from './core-context';
+import { HW_DID_NAME_PREFIX, SW_DID_NAME_PREFIX } from './core-init';
+import { OneErrorCode } from './error-code';
+import { HISTORY_LIST_QUERY_KEY } from './history';
+
+const BACKUP_INFO_QUERY_KEY = 'backup-info';
+
+export const useBackupInfo = () => {
+  const { core } = useONECore();
+
+  return useQuery([BACKUP_INFO_QUERY_KEY], () => core.backupInfo(), {
+    keepPreviousData: true,
+  });
+};
+
+export const useCreateBackup = () => {
+  const queryClient = useQueryClient();
+  const { core } = useONECore();
+
+  return useMutation(
+    async ({ password, outputPath }: { outputPath: string; password: string }) =>
+      core.createBackup(password, outputPath),
+    {
+      onSuccess: () => queryClient.invalidateQueries(HISTORY_LIST_QUERY_KEY),
+    },
+  );
+};
+
+export const useUnpackBackup = () => {
+  const queryClient = useQueryClient();
+  const { core } = useONECore();
+
+  return useMutation(
+    async ({ password, inputPath }: { inputPath: string; password: string }) => core.unpackBackup(password, inputPath),
+    {
+      onSuccess: () => queryClient.resetQueries(),
+    },
+  );
+};
+
+export const useFinalizeImport = () => {
+  const queryClient = useQueryClient();
+  const { core } = useONECore();
+
+  return useMutation(async () => core.finalizeImport(), {
+    onSuccess: () => queryClient.resetQueries(),
+  });
+};
+
+export const useRollbackImport = () => {
+  const queryClient = useQueryClient();
+  const { core } = useONECore();
+
+  return useMutation(async () => core.rollbackImport(), {
+    onSuccess: () => queryClient.resetQueries(),
+  });
+};
+
+export const useBackupFinalizeImportProcedure = () => {
+  const { mutateAsync: finalizeImport } = useFinalizeImport();
+  const { core, organisationId } = useONECore();
+
+  return useCallback(async () => {
+    await finalizeImport();
+
+    // update wallet did references
+    const dids = await core.getDids({
+      deactivated: false,
+      organisationId,
+      page: 0,
+      pageSize: 1,
+      type: DidTypeEnum.LOCAL,
+    });
+    let swDidId = dids.values.find((did) => did.name.startsWith(SW_DID_NAME_PREFIX))?.id;
+
+    if (!swDidId) {
+      const swKeyId = await core.generateKey({
+        keyParams: {},
+        keyType: 'EDDSA',
+        name: `holder-key-sw-${generateUUID()}`,
+        organisationId,
+        storageParams: {},
+        storageType: 'INTERNAL',
+      });
+      swDidId = await core.createDid({
+        didMethod: 'KEY',
+        keys: {
+          assertionMethod: [swKeyId],
+          authentication: [swKeyId],
+          capabilityDelegation: [swKeyId],
+          capabilityInvocation: [swKeyId],
+          keyAgreement: [swKeyId],
+        },
+        name: `${SW_DID_NAME_PREFIX}-${generateUUID()}`,
+        organisationId,
+        params: {},
+      });
+    }
+
+    let hwDidId: string | null = null;
+    const hwKeyId = await core
+      .generateKey({
+        keyParams: {},
+        keyType: 'ES256',
+        name: `holder-key-hw-${generateUUID()}`,
+        organisationId,
+        storageParams: {},
+        storageType: 'SECURE_ELEMENT',
+      })
+      .catch((e) => {
+        // ignore if HW keys not supported by device
+        if (e instanceof OneError && e.code === OneErrorCode.KeyStorageNotSupported) {
+          return null;
+        }
+        throw e;
+      });
+    if (hwKeyId) {
+      hwDidId = await core.createDid({
+        didMethod: 'KEY',
+        keys: {
+          assertionMethod: [hwKeyId],
+          authentication: [hwKeyId],
+          capabilityDelegation: [hwKeyId],
+          capabilityInvocation: [hwKeyId],
+          keyAgreement: [hwKeyId],
+        },
+        name: `${HW_DID_NAME_PREFIX}-${generateUUID()}`,
+        organisationId,
+        params: {},
+      });
+    }
+
+    return [hwDidId, swDidId] as [string | null, string];
+  }, [core, organisationId, finalizeImport]);
+};

package/src/utils/hooks/core/core-config.ts

@@ -0,0 +1,13 @@
+import { useQuery } from 'react-query';
+
+import { useONECore } from './core-context';
+
+const CONFIG_QUERY_KEY = 'config';
+
+export const useCoreConfig = () => {
+  const { core } = useONECore();
+
+  return useQuery([CONFIG_QUERY_KEY], () => core?.getConfig(), {
+    keepPreviousData: true,
+  });
+};