@sumaris-net/ngx-components 18.10.29 → 18.12.0

package/src/app/core/services/base-graphql-service.class.ts

@@ -0,0 +1,319 @@
+import { GraphqlService, MutateQueryOptions, WatchQueryOptions } from '../graphql/graphql.service';
+import { Page } from '../../shared/services/entity-service.class';
+import { Observable } from 'rxjs';
+import { FetchResult } from '@apollo/client/link/core';
+import { EntityUtils } from './model/entity.model';
+import { ApolloCache, InternalRefetchQueriesInclude } from '@apollo/client/core';
+import { isNotEmptyArray, isNotNil, toBoolean } from '../../shared/functions';
+import { environment } from '../../../environments/environment';
+import { Directive, Optional } from '@angular/core';
+import { QueryRef } from 'apollo-angular';
+import { PureQueryOptions } from '@apollo/client/core/types';
+import { DocumentNode } from 'graphql';
+import { StartableService } from '../../shared/services/startable-service.class';
+import { TypedDocumentNode } from '@graphql-typed-document-node/core';
+import { CryptoService } from './crypto.service';
+import { EmptyObject } from '../graphql/graphql.utils';
+import { filter } from 'rxjs/operators';
+
+export interface QueryVariables<F = any> extends Partial<Page> {
+  filter?: F;
+  [key: string]: any;
+}
+
+export interface MutateQueryWithCacheUpdateOptions<T = any, V = EmptyObject> extends MutateQueryOptions<T, V> {
+  cacheInsert?: {
+    query: any;
+    fetchData: (variables: V, mutationResult: FetchResult<T>) => any;
+  }[];
+
+  cacheRemove?: {
+    query: any;
+    fetchIds: (variables: V) => number | number[];
+  }[];
+}
+
+export interface MutableWatchQueryOptions<D, T = any, V = EmptyObject> extends WatchQueryOptions<V> {
+  queryName: string;
+  arrayFieldName: keyof D;
+  totalFieldName?: keyof D;
+  insertFilterFn?: (data: T) => boolean;
+  sortFn?: (a: T, b: T) => number;
+}
+
+export interface MutableWatchQueryDescription<TData, TEntityClass = any, TVariables = EmptyObject> extends PureQueryOptions<TVariables, TData> {
+  id?: string;
+  query: DocumentNode | TypedDocumentNode<TData, TVariables>;
+  queryRef: QueryRef<TData, TVariables>;
+  variables: TVariables;
+  arrayFieldName: keyof TData;
+  totalFieldName?: keyof TData;
+  insertFilterFn?: (data: TEntityClass) => boolean;
+  sortFn?: (a: TEntityClass, b: TEntityClass) => number;
+  counter: number;
+}
+
+export interface FindMutableWatchQueriesOptions {
+  query?: DocumentNode;
+  queries?: DocumentNode[];
+  queryName?: string;
+  queryNames?: string[];
+}
+
+export class BaseGraphqlServiceOptions {
+  production?: boolean;
+}
+
+@Directive()
+// eslint-disable-next-line @angular-eslint/directive-class-suffix
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export abstract class BaseGraphqlService<T = any, F = any, ID = any, S = void> extends StartableService<S> {
+  protected _logPrefix: string;
+  protected _mutableWatchQueries: MutableWatchQueryDescription<any>[] = [];
+
+  // Max updated queries, for this entity.
+  // - Can be override by subclasses (in constructor)
+  // - Use value -1 for no max size
+  // - Default value to 3, because it usually enough (e.g. OperationService and LandingService need at least 2)
+  protected _mutableWatchQueriesMaxCount = 3;
+
+  protected constructor(
+    protected graphql: GraphqlService,
+    @Optional() options?: BaseGraphqlServiceOptions
+  ) {
+    super(graphql);
+
+    // for DEV only
+    this._debug = toBoolean(options && !options.production, !environment.production);
+    this._logPrefix = `[base-graphql-service] `;
+  }
+
+  mutableWatchQuery<D, V = EmptyObject>(opts: MutableWatchQueryOptions<D, T, V>): Observable<D> {
+    opts.fetchPolicy = opts.fetchPolicy || this.graphql.defaultFetchPolicy;
+
+    // Standard query (no cache)
+    if (opts.fetchPolicy === 'no-cache') {
+      return this.graphql.watchQuery(opts);
+    }
+
+    // No arrayFieldName
+    if (!opts.arrayFieldName) {
+      if (this._debug) console.warn(this._logPrefix + "̀Missing 'opts.arrayFieldName' : unable to create a mutable watch query");
+      return this.graphql.watchQuery(opts);
+    }
+
+    // Create the query id
+    const queryId = this.computeMutableWatchQueryId(opts);
+    const exactMatchQueries = this._mutableWatchQueries.filter((q) => q.id === queryId);
+
+    let mutableQuery: MutableWatchQueryDescription<D, T, V>;
+    let queryRef: QueryRef<D, V>;
+
+    if (exactMatchQueries.length === 1) {
+      mutableQuery = exactMatchQueries[0] as MutableWatchQueryDescription<D, T, V>;
+      mutableQuery.counter += 1;
+      queryRef = mutableQuery.queryRef;
+      if (this._debug) console.debug(this._logPrefix + `Find same mutable watch query (same variables) {${queryId}}. Skip register`);
+
+      // Refetch if need data from network
+      if (opts.fetchPolicy === 'network-only' || opts.fetchPolicy === 'cache-and-network') {
+        console.warn(this._logPrefix + ' Mutable query already exists, and fetchPolicy=' + opts.fetchPolicy + '. Force refetch query...');
+        queryRef.refetch(mutableQuery.variables);
+      }
+      //if (mutableQuery.counter > 3) {
+      //  console.warn(this._debugPrefix + 'TODO: clean previous queries with name: ' + queryName);
+      //}
+    } else {
+      queryRef = this.graphql.watchQueryRef<D, V>(opts);
+      this.registerNewMutableWatchQuery({
+        id: queryId,
+        query: opts.query,
+        queryRef,
+        variables: opts.variables,
+        arrayFieldName: opts.arrayFieldName,
+        totalFieldName: opts.totalFieldName,
+        insertFilterFn: opts.insertFilterFn,
+        sortFn: opts.sortFn,
+        counter: 1,
+      });
+    }
+
+    return this.graphql.queryRefValuesChanges(queryRef, opts).pipe(
+      // FIXME: find why sometimes data is an object, and not and array
+      filter((res) => Array.isArray(res[opts.arrayFieldName]))
+    );
+  }
+
+  insertIntoMutableCachedQueries(
+    cache: ApolloCache<any>,
+    opts: FindMutableWatchQueriesOptions & {
+      data: T[] | T;
+    }
+  ) {
+    const queries = this.findMutableWatchQueries(opts);
+    if (!queries.length) return;
+
+    queries.forEach((query) => {
+      if (Array.isArray(opts.data)) {
+        // Filter values, if a filter function exists
+        const data = query.insertFilterFn ? opts.data.filter((d) => query.insertFilterFn(d)) : opts.data;
+        if (isNotEmptyArray(data)) {
+          if (this._debug) console.debug(`[base-data-service] Inserting data into watching query: `, query.id);
+          this.graphql.addManyToQueryCache(cache, {
+            query: query.query,
+            variables: query.variables,
+            arrayFieldName: query.arrayFieldName as string,
+            totalFieldName: query.totalFieldName as string,
+            sortFn: query.sortFn,
+            data,
+          });
+        }
+      }
+      // Filter value, if a filter function exists
+      else if (!query.insertFilterFn || query.insertFilterFn(opts.data)) {
+        if (this._debug) console.debug(`[base-data-service] Inserting data into watching query: `, query.id);
+        this.graphql.insertIntoQueryCache(cache, {
+          query: query.query,
+          variables: query.variables,
+          arrayFieldName: query.arrayFieldName as string,
+          totalFieldName: query.totalFieldName as string,
+          sortFn: query.sortFn,
+          data: opts.data,
+        });
+      }
+    });
+  }
+
+  removeFromMutableCachedQueriesByIds(
+    cache: ApolloCache<any>,
+    opts: FindMutableWatchQueriesOptions & {
+      ids: ID | ID[];
+    }
+  ): number {
+    const queries = this.findMutableWatchQueries(opts);
+    if (!queries.length) return;
+
+    console.debug(`[base-data-service] Removing data from watching queries: `, queries);
+    return (
+      queries
+        .map((query) => {
+          if (Array.isArray(opts.ids)) {
+            return this.graphql.removeFromCachedQueryByIds(cache, {
+              query: query.query,
+              variables: query.variables,
+              arrayFieldName: query.arrayFieldName as string,
+              totalFieldName: query.totalFieldName as string,
+              ids: opts.ids,
+            });
+          } else {
+            return this.graphql.removeFromCachedQueryById(cache, {
+              query: query.query,
+              variables: query.variables,
+              arrayFieldName: query.arrayFieldName as string,
+              totalFieldName: query.totalFieldName as string,
+              ids: opts.ids,
+            })
+              ? 1
+              : 0;
+          }
+        })
+        // Sum
+        .reduce((res, count) => res + count, 0)
+    );
+  }
+
+  async refetchMutableWatchQueries(opts: FindMutableWatchQueriesOptions & { variables?: any }): Promise<void> {
+    // Retrieve queries to refetch
+    const queries = this.findMutableWatchQueries(opts);
+
+    // Skip if nothing to refetch
+    if (!queries.length) return;
+
+    try {
+      await Promise.all(
+        queries.map((query) => {
+          if (this._debug) console.debug(this._logPrefix + `Refetching mutable watch query {${query.id}}`);
+          return query.queryRef.refetch({ ...query.variables, ...opts.variables });
+        })
+      );
+    } catch (err) {
+      console.error(this._logPrefix + 'Error while refetching mutable watch queries', err);
+    }
+  }
+
+  /* -- protected methods -- */
+
+  protected computeMutableWatchQueryId<D, T, V = EmptyObject>(opts: MutableWatchQueryOptions<D, T, V>) {
+    const queryName = opts.queryName || CryptoService.sha256(JSON.stringify(opts.query)).substring(0, 8);
+    const variablesKey = (opts.variables && CryptoService.sha256(JSON.stringify(opts.variables)).substring(0, 8)) || '';
+    return [queryName, opts.arrayFieldName, variablesKey].join('|');
+  }
+
+  protected findMutableWatchQueries(opts: FindMutableWatchQueriesOptions): MutableWatchQueryDescription<any>[] {
+    // Search by queryName
+    if (opts.queryName) {
+      return this._mutableWatchQueries.filter((q) => q.id.startsWith(opts.queryName + '|'));
+    }
+    if (opts.queryNames) {
+      return (
+        opts.queryNames
+          .map((queryName) => this._mutableWatchQueries.filter((q) => q.id.startsWith(queryName + '|')))
+          // flatMap
+          .reduce((res, array) => res.concat(...array), [])
+      );
+    }
+
+    // Search by query
+    if (opts.query) {
+      return this._mutableWatchQueries.filter((q) => q.query === opts.query);
+    }
+    if (opts.queries) {
+      return (
+        opts.queries
+          .filter(isNotNil)
+          .map((query) => this._mutableWatchQueries.filter((q) => q.query === query))
+          // flatMap
+          .reduce((res, array) => res.concat(...array), [])
+      );
+    }
+    throw Error('Invalid options: only one property must be set');
+  }
+
+  protected registerNewMutableWatchQuery(mutableQuery: MutableWatchQueryDescription<any>) {
+    if (this._debug) console.debug(this._logPrefix + `Register new mutable watch query {${mutableQuery.id}}`);
+
+    // If exceed the max size of mutable queries: remove some
+    if (this._mutableWatchQueriesMaxCount > 0 && this._mutableWatchQueries.length >= this._mutableWatchQueriesMaxCount) {
+      const removedWatchQueries = this._mutableWatchQueries.splice(0, 1 + this._mutableWatchQueries.length - this._mutableWatchQueriesMaxCount);
+
+      // Warn, as it shouldn't be happen often, when max is correctly set
+      console.warn(
+        this._logPrefix + `Removing older mutable watching queries (stack exceed max of ${this._mutableWatchQueriesMaxCount}): `,
+        removedWatchQueries.map((q) => q.id)
+      );
+    }
+
+    // Define the sort function (to be used in insertIntoMutableCachedQuery())
+    if (!mutableQuery.sortFn && mutableQuery.variables && mutableQuery.variables.sortBy) {
+      mutableQuery.sortFn =
+        mutableQuery.variables &&
+        mutableQuery.variables.sortBy &&
+        EntityUtils.sortComparator(mutableQuery.variables.sortBy, mutableQuery.variables.sortDirection || 'asc');
+    }
+
+    // Add the new mutable query to array
+    this._mutableWatchQueries.push(mutableQuery);
+  }
+
+  protected findRefetchQueries(opts: FindMutableWatchQueriesOptions): InternalRefetchQueriesInclude {
+    return (
+      this.findMutableWatchQueries(opts)
+        // Workaround, to make refetch queries works: transform into a simple {query, variables}
+        .map(({ query, variables }) => ({ query, variables }))
+    );
+  }
+
+  protected ngOnStart(): Promise<S> {
+    return Promise.resolve(null as S);
+  }
+}

package/src/app/core/services/base58.ts

@@ -0,0 +1,90 @@
+// Base58 encoding/decoding
+// Originally written by Mike Hearn for BitcoinJ
+// Copyright (c) 2011 Google Inc
+// Ported to JavaScript by Stefan Thomas
+// Merged Buffer refactorings from base58-native by Stephen Pair
+// Copyright (c) 2013 BitPay Inc
+// Rewritten in TypeScript by Ludovic Pecquot
+
+// @dynamic
+export class Base58 {
+  private static alphabet = '123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz';
+  private static alphabetMap;
+
+  private static getAlphabetMap() {
+    if (!Base58.alphabetMap) {
+      this.alphabetMap = {};
+      for (let i = 0; i < Base58.alphabet.length; i++) {
+        Base58.alphabetMap[Base58.alphabet.charAt(i)] = i;
+      }
+    }
+    return Base58.alphabetMap;
+  }
+
+  public static encode(buffer: Uint8Array): string {
+    if (buffer.length === 0) return '';
+
+    let i;
+    let j;
+    const digits = [0];
+    for (i = 0; i < buffer.length; i++) {
+      for (j = 0; j < digits.length; j++) digits[j] <<= 8;
+      digits[digits.length - 1] += buffer[i];
+
+      let carry = 0;
+      for (j = digits.length - 1; j >= 0; j--) {
+        digits[j] += carry;
+        carry = (digits[j] / 58) | 0;
+        digits[j] %= 58;
+      }
+
+      while (carry) {
+        digits.unshift(carry);
+        carry = (digits[0] / 58) | 0;
+        digits[0] %= 58;
+      }
+    }
+
+    // deal with leading zeros
+    for (i = 0; i < buffer.length - 1 && buffer[i] === 0; i++) digits.unshift(0);
+
+    return digits
+      .map(function (digit) {
+        return Base58.alphabet[digit];
+      })
+      .join('');
+  }
+
+  public static decode(string: string): Uint8Array {
+    if (string.length === 0) return new Uint8Array(0);
+
+    const input = string.split('').map(function (c) {
+      return Base58.getAlphabetMap()[c];
+    });
+
+    let i;
+    let j;
+    const bytes = [0];
+    for (i = 0; i < input.length; i++) {
+      for (j = 0; j < bytes.length; j++) bytes[j] *= 58;
+      bytes[bytes.length - 1] += input[i];
+
+      let carry = 0;
+      for (j = bytes.length - 1; j >= 0; j--) {
+        bytes[j] += carry;
+        carry = bytes[j] >> 8;
+        bytes[j] &= 0xff;
+      }
+
+      while (carry) {
+        bytes.unshift(carry);
+        carry = bytes[0] >> 8;
+        bytes[0] &= 0xff;
+      }
+    }
+
+    // deal with leading zeros
+    for (i = 0; i < input.length - 1 && input[i] === 0; i++) bytes.unshift(0);
+    return new Uint8Array(bytes);
+  }
+}

package/src/app/core/services/config/core.config.ts

@@ -0,0 +1,263 @@
+// TODO: rename to CONFIG_OPTIONS_MAP
+// then declare a type like this :
+// > export declare type ConfigOptions = key of CONFIG_OPTIONS_MAP
+import { FormFieldDefinition } from '../../../shared/form/field.model';
+import { APP_LOCALES } from '../model/settings.model';
+import { AuthTokenType } from '../network.types';
+
+export const CORE_CONFIG_OPTIONS = Object.freeze({
+  LOGO: <FormFieldDefinition>{
+    key: 'sumaris.logo',
+    label: 'CONFIGURATION.OPTIONS.LOGO',
+    type: 'string',
+  },
+  FAVICON: <FormFieldDefinition>{
+    key: 'sumaris.favicon',
+    label: 'CONFIGURATION.OPTIONS.FAVICON',
+    type: 'string',
+  },
+  DEFAULT_LOCALE: <FormFieldDefinition>{
+    key: 'sumaris.defaultLocale',
+    label: 'CONFIGURATION.OPTIONS.DEFAULT_LOCALE',
+    type: 'enum',
+    values: APP_LOCALES,
+  },
+  DEFAULT_LAT_LONG_FORMAT: <FormFieldDefinition>{
+    key: 'sumaris.defaultLatLongFormat',
+    label: 'CONFIGURATION.OPTIONS.DEFAULT_LATLONG_FORMAT',
+    type: 'enum',
+    values: [
+      {
+        key: 'DDMMSS',
+        value: 'COMMON.LAT_LONG.ENUM.DDMMSS',
+      },
+      {
+        key: 'DDMM',
+        value: 'COMMON.LAT_LONG.ENUM.DDMM',
+      },
+      {
+        key: 'DD',
+        value: 'COMMON.LAT_LONG.ENUM.DD',
+      },
+    ],
+  },
+  /**
+   * @deprecated Use `ACCOUNT_LAT_LONG_FORMAT_ENABLE` instead
+   */
+  //@deprecated
+  DEFAULT_LAT_LONG_FORMAT_ENABLED: <FormFieldDefinition>{
+    key: 'sumaris.defaultLatLongFormat.enabled',
+    label: 'CONFIGURATION.OPTIONS.ENABLE_DEFAULT_LATLONG_FORMAT',
+    type: 'boolean',
+    defaultValue: true, // Important, for compatibility reason after deprecation
+  },
+  REGISTRATION_ENABLE: <FormFieldDefinition>{
+    key: 'sumaris.registration.enable',
+    label: 'CONFIGURATION.OPTIONS.HOME.ENABLE_REGISTRATION',
+    type: 'boolean',
+    defaultValue: true,
+  },
+  AUTH_TOKEN_TYPE: <FormFieldDefinition>{
+    key: 'sumaris.auth.token.type',
+    label: 'CONFIGURATION.OPTIONS.AUTH_TOKEN_TYPE_PLACEHOLDER',
+    type: 'enum',
+    values: [
+      {
+        key: <AuthTokenType>'token',
+        value: 'CONFIGURATION.OPTIONS.AUTH_TOKEN_TYPE.TOKEN',
+      },
+      {
+        key: <AuthTokenType>'basic',
+        value: 'CONFIGURATION.OPTIONS.AUTH_TOKEN_TYPE.BASIC',
+      },
+      {
+        key: <AuthTokenType>'basic-and-token',
+        value: 'CONFIGURATION.OPTIONS.AUTH_TOKEN_TYPE.BASIC_AND_TOKEN',
+      },
+    ],
+    defaultValue: <AuthTokenType>'token',
+  },
+  AUTH_RESET_PASSWORD_ENABLE: <FormFieldDefinition>{
+    key: 'sumaris.auth.reset.enable',
+    label: 'CONFIGURATION.OPTIONS.HOME.CHANGE_PASSWORD',
+    type: 'boolean',
+    defaultValue: true,
+  },
+  AUTH_API_TOKEN_ENABLED: <FormFieldDefinition>{
+    key: 'sumaris.auth.api.token.enabled',
+    label: 'CONFIGURATION.OPTIONS.ENABLE_AUTH_API_TOKENS',
+    type: 'boolean',
+    defaultValue: false,
+    isTransient: true,
+  },
+  AUTH_API_TOKEN_SCOPE_ENABLED: <FormFieldDefinition>{
+    key: 'sumaris.auth.api.token.scope.enabled',
+    label: 'CONFIGURATION.OPTIONS.ENABLE_AUTH_API_TOKENS_SCOPE',
+    type: 'boolean',
+    defaultValue: false,
+    isTransient: true,
+  },
+  DEFAULT_AUTH_API_TOKEN_SCOPE: <FormFieldDefinition>{
+    key: 'sumaris.auth.api.token.scope.default',
+    label: 'CONFIGURATION.OPTIONS.DEFAULT_AUTH_API_TOKEN_SCOPE',
+    type: 'string',
+    defaultValue: 'read_api',
+    isTransient: true,
+  },
+  GRAVATAR_ENABLE: <FormFieldDefinition>{
+    key: 'sumaris.gravatar.enable',
+    label: 'CONFIGURATION.OPTIONS.ENABLE_GRAVATAR',
+    type: 'boolean',
+    defaultValue: false,
+  },
+  GRAVATAR_URL: <FormFieldDefinition>{
+    key: 'sumaris.gravatar.url',
+    label: 'CONFIGURATION.OPTIONS.GRAVATAR_URL',
+    type: 'string',
+    defaultValue: 'https://www.gravatar.com/avatar/{md5}',
+  },
+  TESTING: <FormFieldDefinition>{
+    key: 'sumaris.testing.enable',
+    label: 'CONFIGURATION.OPTIONS.TESTING',
+    type: 'boolean',
+  },
+  APP_MIN_VERSION: <FormFieldDefinition>{
+    key: 'sumaris.app.version.min',
+    label: 'CONFIGURATION.OPTIONS.APP_MIN_VERSION',
+    type: 'string',
+  },
+  HELP_URL: <FormFieldDefinition>{
+    key: 'sumaris.help.url',
+    label: 'CONFIGURATION.OPTIONS.HELP_URL',
+    type: 'string',
+  },
+  FORUM_URL: <FormFieldDefinition>{
+    key: 'sumaris.forum.url',
+    label: 'CONFIGURATION.OPTIONS.FORUM_URL',
+    type: 'string',
+  },
+  REPORT_ISSUE_URL: <FormFieldDefinition>{
+    key: 'sumaris.reportIssue.url',
+    label: 'CONFIGURATION.OPTIONS.REPORT_ISSUE_URL',
+    type: 'string',
+  },
+  PRIVACY_POLICY_URL: <FormFieldDefinition>{
+    key: 'sumaris.policy.url',
+    label: 'CONFIGURATION.OPTIONS.PRIVACY_POLICY_URL',
+    type: 'string',
+  },
+  TERMS_OF_USE_URL: <FormFieldDefinition>{
+    key: 'sumaris.termsOfUse.url',
+    label: 'CONFIGURATION.OPTIONS.TERMS_OF_USE_URL',
+    type: 'string',
+  },
+  LOGO_LARGE: <FormFieldDefinition>{
+    key: 'sumaris.logo.large',
+    label: 'CONFIGURATION.OPTIONS.HOME.LOGO_LARGE',
+    type: 'string',
+  },
+  MENU_ITEMS: <FormFieldDefinition>{
+    key: 'sumaris.menu.items',
+    label: 'CONFIGURATION.OPTIONS.MENU.ITEMS',
+    type: 'string',
+    // -- FOR DEV
+    /*,defaultValue: JSON.stringify([
+        {title: "Item #1", path: "/settings", icon: "people", after: "MENU.HOME"},
+        {title: "Item #2", path: "/settings", icon: "people", before: "MENU.LOGOUT"}
+    ])*/
+  },
+  HOME_PARTNERS_DEPARTMENTS: <FormFieldDefinition>{
+    key: 'sumaris.partner.departments',
+    label: 'CONFIGURATION.OPTIONS.HOME.PARTNER_DEPARTMENTS',
+    type: 'string',
+  },
+  HOME_BACKGROUND_IMAGE: <FormFieldDefinition>{
+    key: 'sumaris.background.images',
+    label: 'CONFIGURATION.OPTIONS.HOME.BACKGROUND_IMAGES',
+    type: 'string',
+  },
+  COLOR_PRIMARY: <FormFieldDefinition>{
+    key: 'sumaris.color.primary',
+    label: 'CONFIGURATION.OPTIONS.COLORS.PRIMARY',
+    type: 'color',
+  },
+  COLOR_SECONDARY: <FormFieldDefinition>{
+    key: 'sumaris.color.secondary',
+    label: 'CONFIGURATION.OPTIONS.COLORS.SECONDARY',
+    type: 'color',
+  },
+  COLOR_TERTIARY: <FormFieldDefinition>{
+    key: 'sumaris.color.tertiary',
+    label: 'CONFIGURATION.OPTIONS.COLORS.TERTIARY',
+    type: 'color',
+  },
+  COLOR_SUCCESS: <FormFieldDefinition>{
+    key: 'sumaris.color.success',
+    label: 'CONFIGURATION.OPTIONS.COLORS.SUCCESS',
+    type: 'color',
+  },
+  COLOR_WARNING: <FormFieldDefinition>{
+    key: 'sumaris.color.warning',
+    label: 'CONFIGURATION.OPTIONS.COLORS.WARNING',
+    type: 'color',
+  },
+  COLOR_ACCENT: <FormFieldDefinition>{
+    key: 'sumaris.color.accent',
+    label: 'CONFIGURATION.OPTIONS.COLORS.ACCENT',
+    type: 'color',
+  },
+  COLOR_DANGER: <FormFieldDefinition>{
+    key: 'sumaris.color.danger',
+    label: 'CONFIGURATION.OPTIONS.COLORS.DANGER',
+    type: 'color',
+  },
+  FORM_FIELD_BACKGROUND_COLOR: <FormFieldDefinition>{
+    key: 'sumaris.theme.fieldBackgroundColor',
+    label: 'CONFIGURATION.OPTIONS.FORM_FIELD_BACKGROUND_COLOR',
+    type: 'color',
+  },
+  FORM_FIELD_FOCUS_BACKGROUND_COLOR: <FormFieldDefinition>{
+    key: 'sumaris.theme.fieldFocusBackgroundColor',
+    label: 'CONFIGURATION.OPTIONS.FORM_FIELD_FOCUS_BACKGROUND_COLOR',
+    type: 'color',
+  },
+  FORM_FIELD_DISABLED_BACKGROUND_COLOR: <FormFieldDefinition>{
+    key: 'sumaris.theme.fieldDisabledBackgroundColor',
+    label: 'CONFIGURATION.OPTIONS.FORM_FIELD_DISABLED_BACKGROUND_COLOR',
+    type: 'color',
+  },
+  ANDROID_INSTALL_URL: <FormFieldDefinition>{
+    key: 'sumaris.android.install.url',
+    label: 'CONFIGURATION.OPTIONS.ANDROID_INSTALL_URL',
+    type: 'string',
+  },
+  IOS_INSTALL_URL: <FormFieldDefinition>{
+    key: 'sumaris.ios.install.url',
+    label: 'CONFIGURATION.OPTIONS.IOS_INSTALL_URL',
+    type: 'string',
+  },
+  DESKTOP_INSTALL_URL: <FormFieldDefinition>{
+    key: 'sumaris.desktop.install.url',
+    label: 'CONFIGURATION.OPTIONS.DESKTOP_INSTALL_URL',
+    type: 'string',
+  },
+  DB_TIMEZONE: <FormFieldDefinition>{
+    key: 'sumaris.persistence.db.timezone',
+    label: 'CONFIGURATION.OPTIONS.DB_TIMEZONE',
+    type: 'string',
+    isTransient: true, // Only on server, cannot be set
+  },
+  ACCOUNT_LAT_LONG_FORMAT_ENABLE: <FormFieldDefinition>{
+    key: 'sumaris.account.latLongFormat.enable',
+    label: 'CONFIGURATION.OPTIONS.ACCOUNT.ENABLE_LATLONG_FORMAT',
+    type: 'boolean',
+    defaultValue: true,
+  },
+  ACCOUNT_READONLY: <FormFieldDefinition>{
+    key: 'sumaris.account.readOnly',
+    label: 'CONFIGURATION.OPTIONS.ACCOUNT.READONLY',
+    type: 'boolean',
+    defaultValue: false,
+    isTransient: true,
+  },
+});