chore: add CONTRIBUTING file

.env.example

@@ -32,8 +32,3 @@ CONTACT_US_MAIL=support@bigcapital.ly
 # Agendash
 AGENDASH_AUTH_USER=agendash
 AGENDASH_AUTH_PASSWORD=123123
-
-# Sign-up restrictions
-SIGNUP_DISABLED=true
-SIGNUP_ALLOWED_DOMAINS=
-SIGNUP_ALLOWED_EMAILS=

CHANGELOG.md

@@ -2,24 +2,6 @@
 
 All notable changes to Bigcapital server-side will be in this file.
 
-## [0.9.1] - 28-06-2023
-
-`@bigcapital/server`
-- fix: deleting ledger entries of manual journal.
-- fix: base currency should be enabled.
-- fix: delete invoice transaction issue.
-
-`@bigcapital/webapp`
-- fix: general, accoutant and items preferences.
-- fix: auto-increment sale invoices, estiamtes, credit notes, payments and manual journals.
-- refactor: the setup organization form to use binded Formik components.
-
-## [0.9.0] - 06-06-2023
-
-`@bigcapital/server`
-
-- [Sign-up restrictions](https://docs.bigcapital.ly/docs/deployment/signup_restriction) for self-hosting instances to disable signup or control the allowed email addresses and domains that can sign-up.
-
 ## [0.8.3] - 06-04-2023
 
 `@bigcaptial/monorepo`

CONTRIBUTING.md

@@ -34,7 +34,7 @@ Contributions via pull requests are much appreciated. Once the approach is agree
 ## Contribute to Backend
 
 - Clone the `bigcapital` repository and `cd` into `bigcapital` directory.
-- Install all npm dependencies of the monorepo, you don't have to change directory to the `backend` package. just hit these command on root directory and it will install dependencies of all packages.
+- Install all npm dependencies of the monorepo, you don't have to change directory to the `backend` package. just hit the command on root directory and it will install dependencies of all packages.
 
 ```
 npm install
@@ -47,7 +47,7 @@ npm run bootstrap
 docker-compose up -d
 ```
 
-Wait some seconds, and hit `docker-compose ps` and you should see the same result below.
+Wait some seconds, and hit `docker-compose ps` to see the result and you should see the same result below.
 
 ```
 CONTAINER ID   IMAGE              COMMAND                  CREATED         STATUS        PORTS                               NAMES
@@ -122,7 +122,7 @@ There are many other ways to get involved with the community and to participate
 - Use the product, submitting GitHub issues when a problem is found.
 - Help code review pull requests and participate in issue threads.
 - Submit a new feature request as an issue.
-- Help answer questions on forums such as Bigcapital Community Discord Channel.
+- Help answer questions on forums such as Stack Overflow and SigNoz Community Slack Channel.
 - Tell others about the project on Twitter, your blog, etc.
 
 **[`^top^`](#)**

docker-compose.prod.yml

@@ -72,11 +72,6 @@ services:
       - AGENDASH_AUTH_USER=${AGENDASH_AUTH_USER}
       - AGENDASH_AUTH_PASSWORD=${AGENDASH_AUTH_PASSWORD}
 
-      # Sign-up restrictions
-      - SIGNUP_DISABLED=${SIGNUP_DISABLED}
-      - SIGNUP_ALLOWED_DOMAINS=${SIGNUP_ALLOWED_DOMAINS}
-      - SIGNUP_ALLOWED_EMAILS=${SIGNUP_ALLOWED_EMAILS}
-
   database_migration:
     container_name: bigcapital-database-migration
     build:

packages/server/Dockerfile

@@ -34,11 +34,7 @@ ARG MAIL_HOST= \
   BASE_URL= \
   # Agendash
   AGENDASH_AUTH_USER=agendash \
-  AGENDASH_AUTH_PASSWORD=123123 \
-  # Sign-up restriction
-  SIGNUP_DISABLED= \
-  SIGNUP_ALLOWED_DOMAINS= \
-  SIGNUP_ALLOWED_EMAILS=
+  AGENDASH_AUTH_PASSWORD=123123 
 
 ENV MAIL_HOST=$MAIL_HOST \
   MAIL_USERNAME=$MAIL_USERNAME \
@@ -72,11 +68,7 @@ ENV MAIL_HOST=$MAIL_HOST \
   # MongoDB
   MONGODB_DATABASE_URL=$MONGODB_DATABASE_URL \
   # Application
-  BASE_URL=$BASE_URL \
-  # Sign-up restriction
-  SIGNUP_DISABLED=$SIGNUP_DISABLED \
-  SIGNUP_ALLOWED_DOMAINS=$SIGNUP_ALLOWED_DOMAINS \
-  SIGNUP_ALLOWED_EMAILS=$SIGNUP_ALLOWED_EMAILS
+  BASE_URL=$BASE_URL
 
 # Create app directory.
 WORKDIR /app

packages/server/src/api/controllers/Accounts.ts

@@ -3,12 +3,7 @@ import { check, param, query } from 'express-validator';
 import { Service, Inject } from 'typedi';
 import asyncMiddleware from '@/api/middleware/asyncMiddleware';
 import BaseController from '@/api/controllers/BaseController';
-import {
-  AbilitySubject,
-  AccountAction,
-  IAccountDTO,
-  IAccountsStructureType,
-} from '@/interfaces';
+import { AbilitySubject, AccountAction, IAccountDTO } from '@/interfaces';
 import { ServiceError } from '@/exceptions';
 import DynamicListingService from '@/services/DynamicListing/DynamicListService';
 import { DATATYPES_LENGTH } from '@/data/DataTypes';
@@ -177,11 +172,6 @@ export default class AccountsController extends BaseController {
 
       query('inactive_mode').optional().isBoolean().toBoolean(),
       query('search_keyword').optional({ nullable: true }).isString().trim(),
-
-      query('structure')
-        .optional()
-        .isString()
-        .isIn([IAccountsStructureType.Tree, IAccountsStructureType.Flat]),
     ];
   }
 
@@ -351,7 +341,6 @@ export default class AccountsController extends BaseController {
       sortOrder: 'desc',
       columnSortBy: 'created_at',
       inactiveMode: false,
-      structure: IAccountsStructureType.Tree,
       ...this.matchedQueryData(req),
     };
 

packages/server/src/api/controllers/Authentication.ts

@@ -49,7 +49,6 @@ export default class AuthenticationController extends BaseController {
       asyncMiddleware(this.resetPassword.bind(this)),
       this.handlerErrors
     );
-    router.get('/meta', asyncMiddleware(this.getAuthMeta.bind(this)));
     return router;
   }
 
@@ -208,23 +207,6 @@ export default class AuthenticationController extends BaseController {
     }
   }
 
-  /**
-   * Retrieves the authentication meta for SPA.
-   * @param {Request} req
-   * @param {Response} res
-   * @param {Function} next
-   * @returns {Response|void}
-   */
-  private async getAuthMeta(req: Request, res: Response, next: Function) {
-    try {
-      const meta = await this.authApplication.getAuthMeta();
-
-      return res.status(200).send({ meta });
-    } catch (error) {
-      next(error);
-    }
-  }
-
   /**
    * Handles the service errors.
    */
@@ -265,30 +247,6 @@ export default class AuthenticationController extends BaseController {
           errors: [{ type: 'EMAIL.EXISTS', code: 600 }],
         });
       }
-      if (error.errorType === 'SIGNUP_RESTRICTED') {
-        return res.status(400).send({
-          errors: [
-            {
-              type: 'SIGNUP_RESTRICTED',
-              message:
-                'Sign-up is restricted no one can sign-up to the system.',
-              code: 700,
-            },
-          ],
-        });
-      }
-      if (error.errorType === 'SIGNUP_RESTRICTED_NOT_ALLOWED') {
-        return res.status(400).send({
-          errors: [
-            {
-              type: 'SIGNUP_RESTRICTED_NOT_ALLOWED',
-              message:
-                'Sign-up is restricted the given email address is not allowed to sign-up.',
-              code: 710,
-            },
-          ],
-        });
-      }
     }
     next(error);
   }

packages/server/src/api/controllers/FinancialStatements/BalanceSheet.ts

@@ -41,7 +41,7 @@ export default class BalanceSheetStatementController extends BaseFinancialReport
   get balanceSheetValidationSchema(): ValidationChain[] {
     return [
       ...this.sheetNumberFormatValidationSchema,
-      query('accounting_method').optional().isIn(['cash', 'accrual']),
+      query('accounting_method').optional().isIn(['cash', 'accural']),
 
       query('from_date').optional(),
       query('to_date').optional(),

packages/server/src/api/controllers/FinancialStatements/GeneralLedger.ts

@@ -67,7 +67,6 @@ export default class GeneralLedgerReportController extends BaseFinancialReportCo
     try {
       const { data, query, meta } =
         await this.generalLedgetService.generalLedger(tenantId, filter);
-
       return res.status(200).send({
         meta: this.transfromToResponse(meta),
         data: this.transfromToResponse(data),

packages/server/src/api/controllers/Organization.ts

@@ -58,7 +58,7 @@ export default class OrganizationController extends BaseController {
   private get organizationValidationSchema(): ValidationChain[] {
     return [
       check('name').exists().trim(),
-      check('industry').optional({ nullable: true }).isString().trim().escape(),
+      check('industry').optional().isString(),
       check('location').exists().isString().isISO31661Alpha2(),
       check('base_currency').exists().isISO4217(),
       check('timezone').exists().isIn(moment.tz.names()),

packages/server/src/before.ts

@@ -4,7 +4,6 @@ import moment from 'moment';
 global.__root_dir = path.join(__dirname, '..');
 global.__resources_dir = path.join(global.__root_dir, 'resources');
 global.__locales_dir = path.join(global.__resources_dir, 'locales');
-global.__views_dir = path.join(global.__root_dir, 'views');
 
 moment.prototype.toMySqlDateTime = function () {
   return this.format('YYYY-MM-DD HH:mm:ss');

packages/server/src/config/index.ts

@@ -1,6 +1,5 @@
 import dotenv from 'dotenv';
 import path from 'path';
-import { castCommaListEnvVarToArray, parseBoolean } from '@/utils';
 
 dotenv.config();
 
@@ -147,19 +146,6 @@ module.exports = {
     },
   },
 
-  /**
-   * Sign-up restrictions
-   */
-  signupRestrictions: {
-    disabled: parseBoolean<boolean>(process.env.SIGNUP_DISABLED, false),
-    allowedDomains: castCommaListEnvVarToArray(
-      process.env.SIGNUP_ALLOWED_DOMAINS
-    ),
-    allowedEmails: castCommaListEnvVarToArray(
-      process.env.SIGNUP_ALLOWED_EMAILS
-    ),
-  },
-
   /**
    * Puppeteer remote browserless connection.
    */

packages/server/src/database/seeds/core/20190423085242_seed_accounts.ts

@@ -3,17 +3,17 @@ import AccountsData from '../data/accounts';
 
 export default class SeedAccounts extends TenantSeeder {
   /**
-   * Seeds initial accounts to the organization.
+   * Seeds initial accounts to the organization. 
    */
   up(knex) {
-    const data = AccountsData.map((account) => ({
-      ...account,
-      name: this.i18n.__(account.name),
-      description: this.i18n.__(account.description),
-      currencyCode: this.tenant.metadata.baseCurrency,
-      seededAt: new Date(),
-    })
-);
+    const data = AccountsData.map((account) => {
+      return {
+        ...account,
+        name: this.i18n.__(account.name),
+        description: this.i18n.__(account.description),
+        currencyCode: this.tenant.metadata.baseCurrency,
+      };
+    });
     return knex('accounts').then(async () => {
       // Inserts seed entries.
       return knex('accounts').insert(data);

packages/server/src/database/seeds/core/20200810121809_seed_settings.ts

@@ -8,7 +8,7 @@ export default class SeedSettings extends TenantSeeder {
   up() {
     const settings = [
       // Orgnization settings.
-      { group: 'organization', key: 'accounting_basis', value: 'accrual' },
+      { group: 'organization', key: 'accounting_basis', value: 'accural' },
 
       // Accounts settings.
       { group: 'accounts', key: 'account_code_unique', value: true },

packages/server/src/interfaces/Account.ts

@@ -79,15 +79,9 @@ export interface IAccountTransaction {
 }
 export interface IAccountResponse extends IAccount {}
 
-export enum IAccountsStructureType {
-  Tree = 'tree',
-  Flat = 'flat',
-}
-
 export interface IAccountsFilter extends IDynamicListFilterDTO {
   stringifiedFilterRoles?: string;
   onlyInactive: boolean;
-  structure?: IAccountsStructureType;
 }
 
 export interface IAccountType {

packages/server/src/interfaces/Authentication.ts

@@ -74,8 +74,4 @@ export interface IAuthSendingResetPassword {
 export interface IAuthSendedResetPassword {
   user: ISystemUser,
   token: string;
-}
-
-export interface IAuthGetMetaPOJO  {
-  signupDisabled: boolean;
 }

packages/server/src/interfaces/BalanceSheet.ts

@@ -44,7 +44,7 @@ export interface IBalanceSheetQuery extends IFinancialSheetBranchesQuery {
   numberFormat: INumberFormatQuery;
   noneTransactions: boolean;
   noneZero: boolean;
-  basis: 'cash' | 'accrual';
+  basis: 'cash' | 'accural';
   accountIds: number[];
 
   percentageOfColumn: boolean;

packages/server/src/interfaces/TrialBalanceSheet.ts

@@ -4,7 +4,7 @@ export interface ITrialBalanceSheetQuery {
   fromDate: Date | string;
   toDate: Date | string;
   numberFormat: INumberFormatQuery;
-  basis: 'cash' | 'accrual';
+  basis: 'cash' | 'accural';
   noneZero: boolean;
   noneTransactions: boolean;
   onlyActive: boolean;

packages/server/src/interfaces/User.ts

@@ -1,7 +1,6 @@
 import { AnyObject } from '@casl/ability/dist/types/types';
 import { ITenant } from '@/interfaces';
 import { Model } from 'objection';
-import { Tenant } from '@/system/models';
 
 export interface ISystemUser extends Model {
   id: number;
@@ -55,52 +54,20 @@ export interface IUserInvite {
 
 export interface IInviteUserService {
   acceptInvite(token: string, inviteUserInput: IInviteUserInput): Promise<void>;
-
-  /**
-   * Re-send user invite.
-   * @param {number} tenantId -
-   * @param {string} email    -
-   * @return {Promise<{ invite: IUserInvite }>}
-   */
   resendInvite(
     tenantId: number,
     userId: number,
     authorizedUser: ISystemUser
   ): Promise<{
-    user: ITenantUser;
+    invite: IUserInvite;
   }>;
-
-  /**
-   * Sends invite mail to the given email from the given tenant and user.
-   * @param {number} tenantId -
-   * @param {string} email -
-   * @param {IUser} authorizedUser -
-   * @return {Promise<IUserInvite>}
-   */
   sendInvite(
     tenantId: number,
-    sendInviteDTO: IUserSendInviteDTO,
+    email: string,
     authorizedUser: ISystemUser
   ): Promise<{
-    invitedUser: ITenantUser;
+    invite: IUserInvite;
   }>;
-}
-
-export interface IAcceptInviteUserService {
-  /**
-   * Accept the received invite.
-   * @param {string} token
-   * @param {IInviteUserInput} inviteUserInput
-   * @throws {ServiceErrors}
-   * @returns {Promise<void>}
-   */
-  acceptInvite(token: string, inviteUserDTO: IInviteUserInput): Promise<void>;
-
-  /**
-   * Validate the given invite token.
-   * @param {string} token - the given token string.
-   * @throws {ServiceError}
-   */
   checkInvite(
     token: string
   ): Promise<{ inviteToken: IUserInvite; orgName: object }>;
@@ -154,7 +121,7 @@ export interface IUserInvitedEventPayload {
   tenantId: number;
   user: ITenantUser;
 }
-export interface IUserInviteTenantSyncedEventPayload {
+export interface IUserInviteTenantSyncedEventPayload{
   invite: IUserInvite;
   authorizedUser: ISystemUser;
   tenantId: number;
@@ -176,10 +143,10 @@ export interface IAcceptInviteEventPayload {
 
 export interface ICheckInviteEventPayload {
   inviteToken: IUserInvite;
-  tenant: Tenant;
+  tenant: ITenant
 }
 
 export interface IUserSendInviteDTO {
   email: string;
   roleId: number;
-}
+}

packages/server/src/jobs/UserInviteMail.ts

@@ -1,6 +1,5 @@
 import { Container, Inject } from 'typedi';
 import InviteUserService from '@/services/InviteUsers/AcceptInviteUser';
-import SendInviteUsersMailMessage from '@/services/InviteUsers/SendInviteUsersMailMessage';
 
 export default class UserInviteMailJob {
   /**
@@ -22,17 +21,24 @@ export default class UserInviteMailJob {
    */
   public async handler(job, done: Function): Promise<void> {
     const { invite, authorizedUser, tenantId } = job.attrs.data;
-    const sendInviteMailMessage = Container.get(SendInviteUsersMailMessage);
+
+    const Logger = Container.get('logger');
+    const inviteUsersService = Container.get(InviteUserService);
+
+    Logger.info(`Send invite user mail - started: ${job.attrs.data}`);
 
     try {
-      await sendInviteMailMessage.sendInviteMail(
+      await inviteUsersService.mailMessages.sendInviteMail(
         tenantId,
         authorizedUser,
         invite
       );
+      Logger.info(`Send invite user mail - finished: ${job.attrs.data}`);
       done();
     } catch (error) {
-      console.log(error);
+      Logger.info(
+        `Send invite user mail - error: ${job.attrs.data}, error: ${error}`
+      );
       done(error);
     }
   }

packages/server/src/lib/Mail/index.ts

@@ -109,7 +109,7 @@ export default class Mail {
    * Retrieve view content from the view directory.
    */
   private getViewContent(): string {
-    const filePath = path.join(global.__views_dir, `/${this.view}`);
+    const filePath = path.join(global.__root_dir, `../views/${this.view}`);
     return fs.readFileSync(filePath, 'utf8');
   }
 }

packages/server/src/lib/Transformer/Transformer.ts

@@ -2,7 +2,6 @@ import moment from 'moment';
 import * as R from 'ramda';
 import { includes, isFunction, isObject, isUndefined, omit } from 'lodash';
 import { formatNumber } from 'utils';
-import { isArrayLikeObject } from 'lodash/fp';
 
 export class Transformer {
   public context: any;
@@ -40,33 +39,12 @@ export class Transformer {
     return object;
   };
 
-  /**
-   *
-   * @param object
-   * @returns
-   */
-  protected preCollectionTransform = (object: any) => {
-    return object;
-  };
-
-  /**
-   *
-   * @param object
-   * @returns
-   */
-  protected postCollectionTransform = (object: any) => {
-    return object;
-  };
-
   /**
    *
    */
   public work = (object: any) => {
     if (Array.isArray(object)) {
-      const preTransformed = this.preCollectionTransform(object);
-      const transformed = preTransformed.map(this.getTransformation);
-
-      return this.postCollectionTransform(transformed);
+      return object.map(this.getTransformation);
     } else if (isObject(object)) {
       return this.getTransformation(object);
     }

packages/server/src/loaders/eventEmitter.ts

@@ -22,7 +22,7 @@ import SaleInvoiceAutoIncrementSubscriber from '@/subscribers/SaleInvoices/AutoI
 import SaleInvoiceConvertFromEstimateSubscriber from '@/subscribers/SaleInvoices/ConvertFromEstimate';
 import PaymentReceiveAutoSerialSubscriber from '@/subscribers/PaymentReceive/AutoSerialIncrement';
 import SyncSystemSendInvite from '@/services/InviteUsers/SyncSystemSendInvite';
-import InviteSendMainNotification from '@/services/InviteUsers/InviteSendMailNotificationSubscribe';
+import InviteSendMainNotification from '@/services/InviteUsers/InviteSendMailNotification';
 import SyncTenantAcceptInvite from '@/services/InviteUsers/SyncTenantAcceptInvite';
 import SyncTenantUserMutate from '@/services/Users/SyncTenantUserSaved';
 import { SyncTenantUserDelete } from '@/services/Users/SyncTenantUserDeleted';

packages/server/src/services/Accounting/LedgerStorageRevert.ts

@@ -10,7 +10,7 @@ export class LedgerRevert {
   private tenancy: HasTenancyService;
 
   @Inject()
-  private ledgerStorage: LedgerStorageService;
+  ledgerStorage: LedgerStorageService;
 
   /**
    * Reverts the jouranl entries.

packages/server/src/services/Accounts/AccountTransform.ts

@@ -1,11 +1,6 @@
-import { IAccount, IAccountsStructureType } from '@/interfaces';
+import { IAccount } from '@/interfaces';
 import { Transformer } from '@/lib/Transformer/Transformer';
-import {
-  assocDepthLevelToObjectTree,
-  flatToNestedArray,
-  formatNumber,
-  nestedArrayToFlatten,
-} from 'utils';
+import { formatNumber } from 'utils';
 
 export class AccountTransformer extends Transformer {
   /**
@@ -13,23 +8,7 @@ export class AccountTransformer extends Transformer {
    * @returns {Array}
    */
   public includeAttributes = (): string[] => {
-    return ['formattedAmount', 'flattenName'];
-  };
-
-  /**
-   * Retrieves the flatten name with all dependants accounts names.
-   * @param {IAccount} account -
-   * @returns {string}
-   */
-  public flattenName = (account: IAccount): string => {
-    const parentDependantsIds = this.options.accountsGraph.dependantsOf(
-      account.id
-    );
-    const prefixAccounts = parentDependantsIds.map((dependId) => {
-      const node = this.options.accountsGraph.getNodeData(dependId);
-      return `${node.name}: `;
-    });
-    return `${prefixAccounts}${account.name}`;
+    return ['formattedAmount'];
   };
 
   /**
@@ -38,28 +17,8 @@ export class AccountTransformer extends Transformer {
    * @returns {string}
    */
   protected formattedAmount = (account: IAccount): string => {
-    return formatNumber(account.amount, { currencyCode: account.currencyCode });
-  };
-
-  /**
-   * Transformes the accounts collection to flat or nested array.
-   * @param {IAccount[]}
-   * @returns {IAccount[]}
-   */
-  protected postCollectionTransform = (accounts: IAccount[]) => {
-    // Transfom the flatten to accounts tree.
-    const transformed = flatToNestedArray(accounts, {
-      id: 'id',
-      parentId: 'parentAccountId',
+    return formatNumber(account.amount, {
+      currencyCode: account.currencyCode,
     });
-    // Associate `accountLevel` attr to indicate object depth.
-    const transformed2 = assocDepthLevelToObjectTree(
-      transformed,
-      1,
-      'accountLevel'
-    );
-    return this.options.structure === IAccountsStructureType.Flat
-      ? nestedArrayToFlatten(transformed2)
-      : transformed2;
   };
 }

packages/server/src/services/Accounts/GetAccount.ts

@@ -22,19 +22,15 @@ export class GetAccount {
    */
   public getAccount = async (tenantId: number, accountId: number) => {
     const { Account } = this.tenancy.models(tenantId);
-    const { accountRepository } = this.tenancy.repositories(tenantId);
 
     // Find the given account or throw not found error.
     const account = await Account.query().findById(accountId).throwIfNotFound();
 
-    const accountsGraph = await accountRepository.getDependencyGraph();
-
     // Transformes the account model to POJO.
     const transformed = await this.transformer.transform(
       tenantId,
       account,
-      new AccountTransformer(),
-      { accountsGraph }
+      new AccountTransformer()
     );
     return this.i18nService.i18nApply(
       [['accountTypeLabel'], ['accountNormalFormatted']],

packages/server/src/services/Accounts/GetAccounts.ts

@@ -1,11 +1,6 @@
 import { Inject, Service } from 'typedi';
 import * as R from 'ramda';
-import {
-  IAccountsFilter,
-  IAccountResponse,
-  IFilterMeta,
-  IAccountsStructureType,
-} from '@/interfaces';
+import { IAccountsFilter, IAccountResponse, IFilterMeta } from '@/interfaces';
 import TenancyService from '@/services/Tenancy/TenancyService';
 import DynamicListingService from '@/services/DynamicListing/DynamicListService';
 import { AccountTransformer } from './AccountTransform';
@@ -43,7 +38,6 @@ export class GetAccounts {
     filterDTO: IAccountsFilter
   ): Promise<{ accounts: IAccountResponse[]; filterMeta: IFilterMeta }> => {
     const { Account } = this.tenancy.models(tenantId);
-    const { accountRepository } = this.tenancy.repositories(tenantId);
 
     // Parses the stringified filter roles.
     const filter = this.parseListFilterDTO(filterDTO);
@@ -59,16 +53,17 @@ export class GetAccounts {
       dynamicList.buildQuery()(builder);
       builder.modify('inactiveMode', filter.inactiveMode);
     });
-
-    const accountsGraph = await accountRepository.getDependencyGraph();
-
-    // Retrieves the transformed accounts collection.
-    const transformedAccounts = await this.transformer.transform(
+    // Retrievs the formatted accounts collection.
+    const preTransformedAccounts = await this.transformer.transform(
       tenantId,
       accounts,
-      new AccountTransformer(),
-      { accountsGraph, structure: filterDTO.structure }
+      new AccountTransformer()
     );
+    // Transform accounts to nested array.
+    const transformedAccounts = flatToNestedArray(preTransformedAccounts, {
+      id: 'id',
+      parentId: 'parentAccountId',
+    });
 
     return {
       accounts: transformedAccounts,

packages/server/src/services/Authentication/AuthApplication.ts

@@ -1,14 +1,8 @@
 import { Service, Inject, Container } from 'typedi';
-import {
-  IRegisterDTO,
-  ISystemUser,
-  IPasswordReset,
-  IAuthGetMetaPOJO,
-} from '@/interfaces';
+import { IRegisterDTO, ISystemUser, IPasswordReset } from '@/interfaces';
 import { AuthSigninService } from './AuthSignin';
 import { AuthSignupService } from './AuthSignup';
 import { AuthSendResetPassword } from './AuthSendResetPassword';
-import { GetAuthMeta } from './GetAuthMeta';
 
 @Service()
 export default class AuthenticationApplication {
@@ -21,9 +15,6 @@ export default class AuthenticationApplication {
   @Inject()
   private authResetPasswordService: AuthSendResetPassword;
 
-  @Inject()
-  private authGetMeta: GetAuthMeta;
-
   /**
    * Signin and generates JWT token.
    * @throws {ServiceError}
@@ -62,12 +53,4 @@ export default class AuthenticationApplication {
   public async resetPassword(token: string, password: string): Promise<void> {
     return this.authResetPasswordService.resetPassword(token, password);
   }
-
-  /**
-   * Retrieves the authentication meta for SPA.
-   * @returns {Promise<IAuthGetMetaPOJO>}
-   */
-  public async getAuthMeta(): Promise<IAuthGetMetaPOJO> {
-    return this.authGetMeta.getAuthMeta();
-  }
 }

packages/server/src/services/Authentication/AuthSignup.ts

@@ -1,4 +1,4 @@
-import { isEmpty, omit } from 'lodash';
+import { omit } from 'lodash';
 import moment from 'moment';
 import { ServiceError } from '@/exceptions';
 import {
@@ -13,7 +13,6 @@ import { EventPublisher } from '@/lib/EventPublisher/EventPublisher';
 import TenantsManagerService from '../Tenancy/TenantsManager';
 import events from '@/subscribers/events';
 import { hashPassword } from '@/utils';
-import config from '@/config';
 
 export class AuthSignupService {
   @Inject()
@@ -34,9 +33,6 @@ export class AuthSignupService {
   public async signUp(signupDTO: IRegisterDTO): Promise<ISystemUser> {
     const { systemUserRepository } = this.sysRepositories;
 
-    // Validates the signup disable restrictions.
-    await this.validateSignupRestrictions(signupDTO.email);
-
     // Validates the given email uniqiness.
     await this.validateEmailUniqiness(signupDTO.email);
 
@@ -78,34 +74,4 @@ export class AuthSignupService {
       throw new ServiceError(ERRORS.EMAIL_EXISTS);
     }
   }
-
-  /**
-   * Validate sign-up disable restrictions.
-   * @param {string} email
-   */
-  private async validateSignupRestrictions(email: string) {
-    // Can't continue if the signup is not disabled.
-    if (!config.signupRestrictions.disabled) return;
-
-    // Validate the allowed email addresses and domains.
-    if (
-      !isEmpty(config.signupRestrictions.allowedEmails) ||
-      !isEmpty(config.signupRestrictions.allowedDomains)
-    ) {
-      const emailDomain = email.split('@').pop();
-      const isAllowedEmail =
-        config.signupRestrictions.allowedEmails.indexOf(email) !== -1;
-
-      const isAllowedDomain = config.signupRestrictions.allowedDomains.some(
-        (domain) => emailDomain === domain
-      );
-
-      if (!isAllowedEmail && !isAllowedDomain) {
-        throw new ServiceError(ERRORS.SIGNUP_RESTRICTED_NOT_ALLOWED);
-      }
-      // Throw error if the signup is disabled with no exceptions.
-    } else {
-      throw new ServiceError(ERRORS.SIGNUP_RESTRICTED);
-    }
-  }
 }

packages/server/src/services/Authentication/GetAuthMeta.ts

@@ -1,16 +0,0 @@
-import { Service } from 'typedi';
-import { IAuthGetMetaPOJO } from '@/interfaces';
-import config from '@/config';
-
-@Service()
-export class GetAuthMeta {
-  /**
-   * Retrieves the authentication meta for SPA.
-   * @returns {Promise<IAuthGetMetaPOJO>}
-   */
-  public async getAuthMeta(): Promise<IAuthGetMetaPOJO> {
-    return {
-      signupDisabled: config.signupRestrictions.disabled,
-    };
-  }
-}

packages/server/src/services/Authentication/_constants.ts

@@ -7,6 +7,4 @@ export const ERRORS = {
   TOKEN_EXPIRED: 'TOKEN_EXPIRED',
   PHONE_NUMBER_EXISTS: 'PHONE_NUMBER_EXISTS',
   EMAIL_EXISTS: 'EMAIL_EXISTS',
-  SIGNUP_RESTRICTED_NOT_ALLOWED: 'SIGNUP_RESTRICTED_NOT_ALLOWED',
-  SIGNUP_RESTRICTED: 'SIGNUP_RESTRICTED',
 };

packages/server/src/services/CreditNotes/CreditNoteGLEntriesSubscriber.ts

@@ -5,13 +5,18 @@ import {
   ICreditNoteDeletedPayload,
   ICreditNoteEditedPayload,
   ICreditNoteOpenedPayload,
+  IRefundCreditNoteOpenedPayload,
 } from '@/interfaces';
 import CreditNoteGLEntries from './CreditNoteGLEntries';
+import HasTenancyService from '@/services/Tenancy/TenancyService';
 
 @Service()
 export default class CreditNoteGLEntriesSubscriber {
   @Inject()
-  private creditNoteGLEntries: CreditNoteGLEntries;
+  creditNoteGLEntries: CreditNoteGLEntries;
+
+  @Inject()
+  tenancy: HasTenancyService;
 
   /**
    * Attaches events with handlers.

packages/server/src/services/FinancialStatements/CashflowAccountTransactions/CashflowAccountTransactionsRepo.ts

@@ -5,7 +5,7 @@ import { ICashflowAccountTransactionsQuery, IPaginationMeta } from '@/interfaces
 @Service()
 export default class CashflowAccountTransactionsRepo {
   @Inject()
-  private tenancy: HasTenancyService;
+  tenancy: HasTenancyService;
 
   /**
    * Retrieve the cashflow account transactions.

packages/server/src/services/FinancialStatements/ProfitLossSheet/utils.ts

@@ -17,7 +17,7 @@ export const getDefaultPLQuery = (): IProfitLossSheetQuery => ({
     formatMoney: 'total',
     precision: 2,
   },
-  basis: 'accrual',
+  basis: 'accural',
 
   noneZero: false,
   noneTransactions: false,

packages/server/src/services/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetService.ts

@@ -35,7 +35,7 @@ export default class TrialBalanceSheetService extends FinancialSheet {
         formatMoney: 'total',
         precision: 2,
       },
-      basis: 'accrual',
+      basis: 'accural',
       noneZero: false,
       noneTransactions: true,
       onlyActive: false,

packages/server/src/services/InviteUsers/AcceptInviteUser.ts

@@ -12,12 +12,9 @@ import {
 } from '@/interfaces';
 import { ERRORS } from './constants';
 import { EventPublisher } from '@/lib/EventPublisher/EventPublisher';
-import { IAcceptInviteUserService } from '@/interfaces';
 
 @Service()
-export default class AcceptInviteUserService
-  implements IAcceptInviteUserService
-{
+export default class AcceptInviteUserService {
   @Inject()
   private eventPublisher: EventPublisher;
 

packages/server/src/services/InviteUsers/InviteSendMailNotification.ts

@@ -1,4 +1,7 @@
-import { IUserInviteTenantSyncedEventPayload } from '@/interfaces';
+import {
+  IUserInvitedEventPayload,
+  IUserInviteTenantSyncedEventPayload,
+} from '@/interfaces';
 import events from '@/subscribers/events';
 import { Inject, Service } from 'typedi';
 

packages/server/src/services/InviteUsers/InviteUsersMailMessages.ts

@@ -1,12 +1,12 @@
-import path from 'path';
 import { ISystemUser } from '@/interfaces';
+import TenancyService from '@/services/Tenancy/TenancyService';
 import Mail from '@/lib/Mail';
-import { Service } from 'typedi';
-import { Tenant } from '@/system/models';
+import { Service, Container } from 'typedi';
 import config from '@/config';
+import { Tenant } from '@/system/models';
 
 @Service()
-export default class SendInviteUsersMailMessage {
+export default class InviteUsersMailMessages {
   /**
    * Sends invite mail to the given email.
    * @param user
@@ -18,7 +18,7 @@ export default class SendInviteUsersMailMessage {
       .findById(tenantId)
       .withGraphFetched('metadata');
 
-    const root = path.join(global.__views_dir, '/images/bigcapital.png');
+    const root = __dirname + '/../../../views/images/bigcapital.png';
 
     const mail = new Mail()
       .setSubject(`${fromUser.firstName} has invited you to join a Bigcapital`)

packages/server/src/services/InviteUsers/SyncTenantAcceptInvite.ts

@@ -8,7 +8,7 @@ import { IAcceptInviteEventPayload } from '@/interfaces';
 @Service()
 export default class SyncTenantAcceptInvite {
   @Inject()
-  private tenancy: HasTenancyService;
+  tenancy: HasTenancyService;
 
   /**
    * Attaches events with handlers.

packages/server/src/services/InviteUsers/TenantInviteUser.ts

@@ -74,15 +74,17 @@ export default class InviteTenantUserService implements IInviteUserService {
 
   /**
    * Re-send user invite.
-   * @param {number} tenantId -
-   * @param {string} email -
+   * @param  {number} tenantId -
+   * @param  {string} email    -
    * @return {Promise<{ invite: IUserInvite }>}
    */
   public async resendInvite(
     tenantId: number,
     userId: number,
     authorizedUser: ISystemUser
-  ): Promise<{ user: ITenantUser }> {
+  ): Promise<{
+    user: ITenantUser;
+  }> {
     // Retrieve the user by id or throw not found service error.
     const user = await this.getUserByIdOrThrowError(tenantId, userId);
 

packages/server/src/services/ManualJournals/CommandManualJournalValidators.ts

@@ -1,10 +1,11 @@
-import { difference } from 'lodash';
+import { difference, sumBy, omit, map } from 'lodash';
 import { Service, Inject } from 'typedi';
 import { ServiceError } from '@/exceptions';
 import {
   IManualJournalDTO,
   IManualJournalEntry,
   IManualJournal,
+  IManualJournalEntryDTO,
 } from '@/interfaces';
 import TenancyService from '@/services/Tenancy/TenancyService';
 import { ERRORS } from './constants';
@@ -285,7 +286,7 @@ export class CommandManualJournalValidators {
   public validateJournalCurrencyWithAccountsCurrency = async (
     tenantId: number,
     manualJournalDTO: IManualJournalDTO,
-    baseCurrency: string
+    baseCurrency: string,
   ) => {
     const { Account } = this.tenancy.models(tenantId);
 

packages/server/src/services/ManualJournals/ManualJournalGLEntries.ts

@@ -3,20 +3,25 @@ import * as R from 'ramda';
 import {
   IManualJournal,
   IManualJournalEntry,
+  IAccount,
   ILedgerEntry,
 } from '@/interfaces';
 import { Knex } from 'knex';
 import Ledger from '@/services/Accounting/Ledger';
 import LedgerStorageService from '@/services/Accounting/LedgerStorageService';
 import HasTenancyService from '@/services/Tenancy/TenancyService';
+import { LedgerRevert } from '@/services/Accounting/LedgerStorageRevert';
 
 @Service()
 export class ManualJournalGLEntries {
   @Inject()
-  private ledgerStorage: LedgerStorageService;
+  ledgerStorage: LedgerStorageService;
 
   @Inject()
-  private tenancy: HasTenancyService;
+  ledgerRevert: LedgerRevert;
+
+  @Inject()
+  tenancy: HasTenancyService;
 
   /**
    * Create manual journal GL entries.
@@ -72,7 +77,7 @@ export class ManualJournalGLEntries {
     manualJournalId: number,
     trx?: Knex.Transaction
   ): Promise<void> => {
-    return this.ledgerStorage.deleteByReference(
+    return this.ledgerRevert.revertGLEntries(
       tenantId,
       manualJournalId,
       'Journal',
@@ -81,7 +86,7 @@ export class ManualJournalGLEntries {
   };
 
   /**
-   * Retrieves the ledger of the given manual journal.
+   *
    * @param   {IManualJournal} manualJournal
    * @returns {Ledger}
    */
@@ -92,13 +97,11 @@ export class ManualJournalGLEntries {
   };
 
   /**
-   * Retrieves the common entry details of the manual journal
+   *
    * @param   {IManualJournal} manualJournal
-   * @returns {Partial<ILedgerEntry>}
+   * @returns {}
    */
-  private getManualJournalCommonEntry = (
-    manualJournal: IManualJournal
-  ): Partial<ILedgerEntry> => {
+  private getManualJournalCommonEntry = (manualJournal: IManualJournal) => {
     return {
       transactionNumber: manualJournal.journalNumber,
       referenceNumber: manualJournal.reference,
@@ -115,8 +118,7 @@ export class ManualJournalGLEntries {
   };
 
   /**
-   * Retrieves the ledger entry of the given manual journal and
-   * its associated entry.
+   *
    * @param   {IManualJournal} manualJournal -
    * @param   {IManualJournalEntry} entry -
    * @returns {ILedgerEntry}
@@ -147,7 +149,7 @@ export class ManualJournalGLEntries {
   );
 
   /**
-   * Retrieves the ledger of the given manual journal.
+   *
    * @param   {IManualJournal} manualJournal
    * @returns {ILedgerEntry[]}
    */

packages/server/src/services/Projects/Projects/ProjectBillableBillSubscriber.ts

@@ -23,11 +23,8 @@ export class ProjectBillableBillSubscriber {
       events.saleInvoice.onCreated,
       this.handleIncreaseBillableBill
     );
-    bus.subscribe(events.saleInvoice.onEdited, this.handleEditBillableBill);
-    bus.subscribe(
-      events.saleInvoice.onDeleted,
-      this.handleDecreaseBillableBill
-    );
+    bus.subscribe(events.saleInvoice.onEdited, this.handleDecreaseBillableBill);
+    bus.subscribe(events.saleInvoice.onDeleted, this.handleEditBillableBill);
   }
 
   /**

packages/server/src/services/Projects/Projects/ProjectBillableExpenseInvoiced.ts

@@ -1,11 +1,7 @@
 import { Knex } from 'knex';
 import { Inject, Service } from 'typedi';
 import async from 'async';
-import {
-  ISaleInvoice,
-  ISaleInvoiceDTO,
-  ProjectLinkRefType,
-} from '@/interfaces';
+import { ISaleInvoice, ISaleInvoiceDTO, ProjectLinkRefType } from '@/interfaces';
 import { ProjectBillableExpense } from './ProjectBillableExpense';
 import { filterEntriesByRefType } from './_utils';
 

packages/server/src/services/Projects/Projects/ProjectBillableExpenseSubscriber.ts

@@ -21,10 +21,13 @@ export class ProjectBillableExpensesSubscriber {
       events.saleInvoice.onCreated,
       this.handleIncreaseBillableExpenses
     );
-    bus.subscribe(events.saleInvoice.onEdited, this.handleEditBillableExpenses);
+    bus.subscribe(
+      events.saleInvoice.onEdited,
+      this.handleDecreaseBillableExpenses
+    );
     bus.subscribe(
       events.saleInvoice.onDeleted,
-      this.handleDecreaseBillableExpenses
+      this.handleEditBillableExpenses
     );
   }
 

packages/server/src/utils/index.ts

@@ -419,58 +419,6 @@ export const parseDate = (date: string) => {
   return date ? moment(date).utcOffset(0).format('YYYY-MM-DD') : '';
 };
 
-const nestedArrayToFlatten = (
-  collection,
-  property = 'children',
-  parseItem = (a, level) => a,
-  level = 1
-) => {
-  const parseObject = (obj) =>
-    parseItem(
-      {
-        ..._.omit(obj, [property]),
-      },
-      level
-    );
-
-  return collection.reduce((items, currentValue, index) => {
-    let localItems = [...items];
-    const parsedItem = parseObject(currentValue, level);
-    localItems.push(parsedItem);
-
-    if (Array.isArray(currentValue[property])) {
-      const flattenArray = nestedArrayToFlatten(
-        currentValue[property],
-        property,
-        parseItem,
-        level + 1
-      );
-      localItems = _.concat(localItems, flattenArray);
-    }
-    return localItems;
-  }, []);
-};
-
-const assocDepthLevelToObjectTree = (
-  objects,
-  level = 1,
-  propertyName = 'level'
-) => {
-  for (let i = 0; i < objects.length; i++) {
-    const object = objects[i];
-    object[propertyName] = level;
-
-    if (object.children) {
-      assocDepthLevelToObjectTree(object.children, level + 1, propertyName);
-    }
-  }
-  return objects;
-};
-
-const castCommaListEnvVarToArray = (envVar: string): Array<string> => {
-  return envVar ? envVar?.split(',')?.map(_.trim) : [];
-};
-
 export {
   templateRender,
   accumSum,
@@ -501,7 +449,4 @@ export {
   dateRangeFromToCollection,
   transformToMapKeyValue,
   mergeObjectsBykey,
-  nestedArrayToFlatten,
-  assocDepthLevelToObjectTree,
-  castCommaListEnvVarToArray
 };

packages/webapp/package-lock.json

@@ -1205,9 +1205,9 @@
       }
     },
     "@blueprintjs-formik/core": {
-      "version": "0.3.3",
-      "resolved": "https://registry.npmjs.org/@blueprintjs-formik/core/-/core-0.3.3.tgz",
-      "integrity": "sha512-ko7g54YSEcSq2K/GEpmiTG0foGLqe7DwgXGhkGxYEiHhLAUv8WvQmrFsm8e/KOW7n8mLGq0uaZVe2l8m3JTGGQ==",
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/@blueprintjs-formik/core/-/core-0.2.1.tgz",
+      "integrity": "sha512-YGJe+QorDGbkWDSUg6x69LYGN62Kgvb92Iz/voqmszVRKj4KcoPvd/7coF8Jmu+ZQE6LcwM/9ccB2i63L99ITA==",
       "requires": {
         "lodash.get": "^4.4.2",
         "lodash.keyby": "^4.6.0",
@@ -1227,9 +1227,9 @@
       }
     },
     "@blueprintjs-formik/select": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/@blueprintjs-formik/select/-/select-0.2.3.tgz",
-      "integrity": "sha512-j/zkX0B9wgtoHgK6Z/rlowB7F7zemrAajBU+d3caCoEYMMqwAI0XA++GytqrIhv5fEGjkZ1hkxS9j8eqX8vtjA==",
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/@blueprintjs-formik/select/-/select-0.1.5.tgz",
+      "integrity": "sha512-EqGbuoiS1VrWpzjd39uVhBAmfVobdpgqalGcpODyGA+XAYoft1UU12yzTzrEOwBZpQKiC12UQwekUPspYBsVKA==",
       "requires": {
         "lodash.get": "^4.4.2",
         "lodash.keyby": "^4.6.0",
@@ -7298,11 +7298,6 @@
         "locate-path": "^3.0.0"
       }
     },
-    "flat": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/flat/-/flat-5.0.2.tgz",
-      "integrity": "sha512-b6suED+5/3rTpUBdG1gupIl8MPFCAMA0QXwmljLhvCUKcUvdE4gWky9zpuGCcXHOsz4J9wPGNWq6OKpmIzz3hQ=="
-    },
     "flat-cache": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-2.0.1.tgz",

packages/webapp/package.json

@@ -3,9 +3,9 @@
   "version": "1.7.1",
   "private": true,
   "dependencies": {
-    "@blueprintjs-formik/core": "^0.3.3",
+    "@blueprintjs-formik/core": "^0.2.1",
     "@blueprintjs-formik/datetime": "^0.3.4",
-    "@blueprintjs-formik/select": "^0.2.3",
+    "@blueprintjs-formik/select": "^0.1.4",
     "@blueprintjs/core": "^3.50.2",
     "@blueprintjs/datetime": "^3.23.12",
     "@blueprintjs/popover2": "^0.11.1",
@@ -45,7 +45,6 @@
     "deepdash": "^5.3.9",
     "dependency-graph": "^0.11.0",
     "fast-deep-equal": "^3.1.3",
-    "flat": "^5.0.2",
     "formik": "^2.2.5",
     "http-proxy-middleware": "^1.0.0",
     "jest": "24.9.0",

packages/webapp/public/icons/flags/AD.svg

@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>AD</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#1537D1" offset="0%"></stop>
+            <stop stop-color="#0522A5" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#EA3058" offset="0%"></stop>
+            <stop stop-color="#CE173E" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-4">
+            <stop stop-color="#FFCF3C" offset="0%"></stop>
+            <stop stop-color="#FECB2F" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="AD">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask-Copy" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask" fill="url(#linearGradient-3)" x="10" y="0" width="11" height="15"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-4)" x="7" y="0" width="7" height="15"></rect>
+            <polygon id="Rectangle-139-Copy" fill="#FFEDB1" points="9.5 6.5 10.5 6.5 10.5 7 9.5 7"></polygon>
+            <path d="M9.6650265,7.9595207 C9.68963036,8.25476702 9.9569379,8.5 10.2524408,8.5 L10.7475592,8.5 C11.042238,8.5 11.3105295,8.2528489 11.3349735,7.9595207 L11.4566002,6.5 L9.54339977,6.5 L9.6650265,7.9595207 Z M9.04128242,6.49538898 C9.01848277,6.2217932 9.2157526,6 9.49538898,6 L11.504611,6 C11.7782068,6 11.9820206,6.2157526 11.9587176,6.49538898 L11.8332464,8.00104344 C11.7872707,8.55275191 11.3030501,9 10.7475592,9 L10.2524408,9 C9.69880801,9 9.21311164,8.55733967 9.16675362,8.00104344 L9.04128242,6.49538898 Z" id="Rectangle-137" fill="#D32E28" fill-rule="nonzero"></path>
+            <polygon id="Rectangle-139" fill="#D32E28" points="9.5 7 11.5 7 11.5 7.5 11 7.5 10 7.5 9.5 7.5"></polygon>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/AG.svg

@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>AG</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#E2243B" offset="0%"></stop>
+            <stop stop-color="#CC162C" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#262626" offset="0%"></stop>
+            <stop stop-color="#0D0D0D" offset="100%"></stop>
+        </linearGradient>
+        <polygon id="path-4" points="0 0 21 0 10.5 15"></polygon>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-6">
+            <stop stop-color="#FFCF3C" offset="0%"></stop>
+            <stop stop-color="#FECB2F" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-7">
+            <stop stop-color="#1984D8" offset="0%"></stop>
+            <stop stop-color="#1175C4" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="AG">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <path d="M8.5,7 C8.5,7.73933629 8.90117129,8.38497401 9.49770903,8.73110833 M11.576137,8.68609748 C12.1317007,8.33077576 12.5,7.70839833 12.5,7" id="Oval-5" opacity="0.75"></path>
+            <ellipse id="Oval-5" fill-opacity="0.5" fill="#FFFFFF" cx="10.5" cy="6.5" rx="1" ry="1.5"></ellipse>
+            <rect id="Mask-Copy" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="15"></rect>
+            <mask id="mask-5" fill="white">
+                <use xlink:href="#path-4"></use>
+            </mask>
+            <use id="Mask" fill="url(#linearGradient-3)" xlink:href="#path-4"></use>
+            <polygon id="Star-1" fill="url(#linearGradient-6)" mask="url(#mask-5)" points="10.5 8.25 8.77792455 10.1574579 8.90900974 7.59099026 6.3425421 7.72207545 8.25 6 5.99999999 3.99999993 8.90900963 4.49999993 8.49999999 1.49999999 10.5 3.99999993 12.5 1.49999999 12.0909905 4.49999993 15 4 12.75 6 14.6574579 7.72207545 12.0909903 7.59099026 12.2220754 10.1574579"></polygon>
+            <rect id="Rectangle-2" fill="url(#linearGradient-7)" mask="url(#mask-5)" x="0" y="6" width="21" height="4"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-1)" mask="url(#mask-5)" x="0" y="10" width="21" height="5"></rect>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/AI.svg

@@ -0,0 +1,50 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>AI</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#0A17A7" offset="0%"></stop>
+            <stop stop-color="#030E88" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#DB1E36" offset="0%"></stop>
+            <stop stop-color="#D51931" offset="100%"></stop>
+        </linearGradient>
+        <path d="M0,2.5 L0,0 L1,0.5 L2,0 L3,0.5 L4,0 L4,2.5 C4,4 2,5 2,5 C2,5 0,4 0,2.5 Z" id="path-4"></path>
+        <filter x="-6.2%" y="-5.0%" width="112.5%" height="120.0%" filterUnits="objectBoundingBox" id="filter-6">
+            <feOffset dx="0" dy="0.5" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.06 0" type="matrix" in="shadowOffsetOuter1"></feColorMatrix>
+        </filter>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-7">
+            <stop stop-color="#FFA51B" offset="0%"></stop>
+            <stop stop-color="#FF9A00" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="AI">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask-Copy" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="15"></rect>
+            <path d="M3,3.22996746 L-1.3516287,-0.5 L0.660232527,-0.5 L4.16023253,2 L4.85660189,2 L9.5,-0.902123821 L9.5,0.25 C9.5,0.552509227 9.33308555,0.876533554 9.08215972,1.05576629 L6,3.25730895 L6,3.77003254 L9.13722049,6.45907867 C9.59934261,6.85518335 9.34102897,7.5 8.75,7.5 C8.50478614,7.5 8.2052751,7.40393402 8.00092153,7.25796718 L4.83976747,5 L4.14339811,5 L-0.5,7.90212382 L-0.5,6.24269105 L3,3.74269105 L3,3.22996746 Z" id="Rectangle-36" fill="url(#linearGradient-1)" fill-rule="nonzero"></path>
+            <path d="M3.5,3 L-4.4408921e-16,7.10542736e-15 L0.5,7.10542736e-15 L4,2.5 L5,2.5 L9,7.10542736e-15 L9,0.25 C9,0.388071187 8.91348267,0.561798096 8.79154062,0.648899555 L5.5,3 L5.5,4 L8.8118248,6.83870697 C8.91575109,6.92778665 8.8840332,7 8.75,7 L8.75,7 C8.61192881,7 8.41348267,6.9382019 8.29154062,6.85110044 L5,4.5 L4,4.5 L-4.4408921e-16,7 L-4.4408921e-16,6.5 L3.5,4 L3.5,3 Z" id="Rectangle-36" fill="url(#linearGradient-3)"></path>
+            <path d="M-4.4408921e-16,2.5 L-4.4408921e-16,4.5 L3.5,4.5 L3.5,7.00461102 C3.5,7.2782068 3.71403503,7.5 4.00468445,7.5 L4.99531555,7.5 C5.27404508,7.5 5.5,7.2842474 5.5,7.00461102 L5.5,4.5 L9.00952148,4.5 C9.28040529,4.5 9.5,4.28596497 9.5,3.99531555 L9.5,3.00468445 C9.5,2.72595492 9.28494263,2.5 9.00952148,2.5 L5.5,2.5 L5.5,7.10542736e-15 L3.5,7.10542736e-15 L3.5,2.5 L-4.4408921e-16,2.5 Z" id="Rectangle-2" fill="url(#linearGradient-1)"></path>
+            <polygon id="Rectangle-36" fill="url(#linearGradient-3)" points="-4.4408921e-16 3 4 3 4 2.5 4 7.10542736e-15 5 7.10542736e-15 5 2.5 5 3 9 3 9 4 5 4 5 4.5 5 7 4 7 4 4.5 4 4 -4.4408921e-16 4"></polygon>
+            <g id="Rectangle-1105" transform="translate(13.000000, 5.000000)">
+                <mask id="mask-5" fill="white">
+                    <use xlink:href="#path-4"></use>
+                </mask>
+                <g id="Mask">
+                    <use fill="black" fill-opacity="1" filter="url(#filter-6)" xlink:href="#path-4"></use>
+                    <use fill="url(#linearGradient-1)" fill-rule="evenodd" xlink:href="#path-4"></use>
+                </g>
+                <rect id="Rectangle-1106" fill="#9ACCFF" mask="url(#mask-5)" x="0" y="4" width="4" height="1"></rect>
+                <path d="M2,2 C1.72385763,2 1.5,1.77614237 1.5,1.5 C1.5,1.22385763 1.72385763,1 2,1 C2.27614237,1 2.5,1.22385763 2.5,1.5 C2.5,1.77614237 2.27614237,2 2,2 Z M1,3 C0.723857625,3 0.5,2.77614237 0.5,2.5 C0.5,2.22385763 0.723857625,2 1,2 C1.27614237,2 1.5,2.22385763 1.5,2.5 C1.5,2.77614237 1.27614237,3 1,3 Z M3,3 C2.72385763,3 2.5,2.77614237 2.5,2.5 C2.5,2.22385763 2.72385763,2 3,2 C3.27614237,2 3.5,2.22385763 3.5,2.5 C3.5,2.77614237 3.27614237,3 3,3 Z" id="Oval-170" fill="url(#linearGradient-7)" mask="url(#mask-5)"></path>
+            </g>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/AS.svg

@@ -0,0 +1,36 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>AS</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#071585" offset="0%"></stop>
+            <stop stop-color="#000B64" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#D32636" offset="0%"></stop>
+            <stop stop-color="#BA1827" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="35.4001096%" y2="89.1313033%" id="linearGradient-4">
+            <stop stop-color="#AB5423" offset="0%"></stop>
+            <stop stop-color="#5A3719" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="AS">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="15"></rect>
+            <polygon id="Rectangle-1134" fill="url(#linearGradient-3)" fill-rule="nonzero" points="22 15.5 0 7.5 22 -0.5"></polygon>
+            <polygon id="Rectangle-1134" fill="url(#linearGradient-1)" fill-rule="nonzero" points="21 0.927699992 2.92617498 7.5 21 14.0723"></polygon>
+            <path d="M16,7.038486 C15.8815511,6.92003711 15.1942139,7.19421386 15.1942139,7.19421386 L14,6 C14,6 13.9383569,5.33698587 14.5,5 C14.9247187,4.74516878 15.7204931,4.83977815 16.4990013,4.5 C17.7459982,3.95575102 19,3 19,3 L18.1979642,5.20559849 C18.1979642,5.20559849 19.1166408,5.67923724 18.9999998,6 C18.9661979,6.0929551 18.0694389,6.38457486 17.9999998,6.5 C17.8680615,6.71931452 18.5239661,6.78580715 18.3197925,7.03848593 C17.7327784,7.76495606 17,8.5 17,8.5 L16,8 C16,8 16.1501465,7.18863249 16,7.038486 Z" id="Rectangle-1475" fill="url(#linearGradient-4)"></path>
+            <circle id="Oval-322" fill="#FFC322" cx="13.5" cy="7.5" r="1"></circle>
+            <path d="M12.5,9 L17.5,9 C17.7761424,9 18,8.77614237 18,8.5 C18,8.22385763 17.7761424,8 17.5,8 L12.5,8 C12.2238576,8 12,8.22385763 12,8.5 C12,8.77614237 12.2238576,9 12.5,9 Z" id="Line" fill="#FFC322" fill-rule="nonzero"></path>
+            <path d="M14.1969596,10.4595725 L17.6969596,8.95957252 C17.9507745,8.8507947 18.0683503,8.55685524 17.9595725,8.30304035 C17.8507947,8.04922546 17.5568552,7.93164967 17.3030404,8.04042748 L13.8030404,9.54042748 C13.5492255,9.6492053 13.4316497,9.94314476 13.5404275,10.1969596 C13.6492053,10.4507745 13.9431448,10.5683503 14.1969596,10.4595725 Z" id="Line-Copy" fill="#FFC322" fill-rule="nonzero"></path>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/AT.svg

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>AT</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#F64253" offset="0%"></stop>
+            <stop stop-color="#EA2D3F" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="AT">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="5"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-2)" x="0" y="10" width="21" height="5"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-1)" x="0" y="5" width="21" height="5"></rect>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/AX.svg

@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>AX</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#157CBB" offset="0%"></stop>
+            <stop stop-color="#0E6CA5" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#FFD34D" offset="0%"></stop>
+            <stop stop-color="#FECB2F" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-4">
+            <stop stop-color="#EB363A" offset="0%"></stop>
+            <stop stop-color="#D52B2F" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="AX">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask-Copy" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="15"></rect>
+            <polygon id="Rectangle-2" fill="url(#linearGradient-3)" points="0 9 6 9 6 15 9 15 9 9 21 9 21 6 9 6 9 0 6 0 6 6 0 6"></polygon>
+            <polygon id="Rectangle-2" fill="url(#linearGradient-4)" points="0 8 7 8 7 15 8 15 8 8 21 8 21 7 8 7 8 0 7 0 7 7 0 7"></polygon>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/BE.svg

@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>BE</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#FF4453" offset="0%"></stop>
+            <stop stop-color="#EE2A39" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#262626" offset="0%"></stop>
+            <stop stop-color="#0D0D0D" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-4">
+            <stop stop-color="#FFCF3C" offset="0%"></stop>
+            <stop stop-color="#FECB2F" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="BE">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask" fill="url(#linearGradient-2)" x="10" y="0" width="11" height="15"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-3)" x="0" y="0" width="7" height="15"></rect>
+            <rect id="Rectangle-2-Copy" fill="url(#linearGradient-4)" x="7" y="0" width="7" height="15"></rect>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/BF.svg

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>BF</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#00B051" offset="0%"></stop>
+            <stop stop-color="#009F49" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#FA494B" offset="0%"></stop>
+            <stop stop-color="#F02B2D" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="BF">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-2)" x="0" y="8" width="21" height="7"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-3)" x="0" y="0" width="21" height="8"></rect>
+            <polygon id="Star-8" fill="#FDD216" points="10.5 9.17000005 8.73664424 10.427051 9.38726383 8.3615499 7.64683045 7.07294902 9.81229123 7.05345008 10.5 5 11.1877088 7.05345008 13.3531695 7.07294902 11.6127362 8.3615499 12.2633558 10.427051"></polygon>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/BH.svg

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>BH</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#E7243B" offset="0%"></stop>
+            <stop stop-color="#CC162C" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="BH">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask-Copy" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="15"></rect>
+            <polygon id="Rectangle-2-Copy" fill="url(#linearGradient-1)" points="0 15 7.5 15 6 14 7.5 13 6 12 7.5 11 6 10 7.5 9 6 8 7.5 7 6 6 7.5 5 6 4 7.5 3 6 2 7.5 1 6 0 0 0"></polygon>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/BJ.svg

@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>BJ</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#F12641" offset="0%"></stop>
+            <stop stop-color="#E71834" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#FFD648" offset="0%"></stop>
+            <stop stop-color="#FCD036" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-4">
+            <stop stop-color="#17A668" offset="0%"></stop>
+            <stop stop-color="#118653" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="BJ">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-2)" x="0" y="7" width="21" height="8"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-3)" x="0" y="0" width="21" height="7"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-4)" x="0" y="0" width="8" height="15"></rect>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/BL.svg

@@ -0,0 +1,42 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>BL</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#216CD3" offset="0%"></stop>
+            <stop stop-color="#1557B2" offset="100%"></stop>
+        </linearGradient>
+        <path d="M0.5,0 L7.49999992,0 L7.49999998,4.49121523 C7.49999999,5.04835167 7.16440529,5.78765261 6.74055213,6.15095532 L5.1460309,7.5176878 C4.51309551,8.06020385 3.48356295,8.05733967 2.8539691,7.5176878 L1.25944787,6.15095532 C0.840016394,5.79144262 0.5,5.04991192 0.5,4.49121523 L0.5,0 Z" id="path-3"></path>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-5">
+            <stop stop-color="#F7E14B" offset="0%"></stop>
+            <stop stop-color="#F7DF3E" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-6">
+            <stop stop-color="#E12539" offset="0%"></stop>
+            <stop stop-color="#CA192C" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="BL">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <g id="Rectangle-1693" transform="translate(6.500000, 5.000000)">
+                <mask id="mask-4" fill="white">
+                    <use xlink:href="#path-3"></use>
+                </mask>
+                <use id="Combined-Shape" fill="url(#linearGradient-2)" xlink:href="#path-3"></use>
+                <path d="M2,2 C1.72385763,2 1.5,1.77614237 1.5,1.5 C1.5,1.22385763 1.72385763,1 2,1 C2.27614237,1 2.5,1.22385763 2.5,1.5 C2.5,1.77614237 2.27614237,2 2,2 Z M4,2 C3.72385763,2 3.5,1.77614237 3.5,1.5 C3.5,1.22385763 3.72385763,1 4,1 C4.27614237,1 4.5,1.22385763 4.5,1.5 C4.5,1.77614237 4.27614237,2 4,2 Z M6,2 C5.72385763,2 5.5,1.77614237 5.5,1.5 C5.5,1.22385763 5.72385763,1 6,1 C6.27614237,1 6.5,1.22385763 6.5,1.5 C6.5,1.77614237 6.27614237,2 6,2 Z" id="Combined-Shape" fill="url(#linearGradient-5)" mask="url(#mask-4)"></path>
+                <path d="M2.5,6.5 C2.22385763,6.5 2,6.27614237 2,6 C2,5.72385763 2.22385763,5.5 2.5,5.5 C2.77614237,5.5 3,5.72385763 3,6 C3,6.27614237 2.77614237,6.5 2.5,6.5 Z M4,7 C3.72385763,7 3.5,6.77614237 3.5,6.5 C3.5,6.22385763 3.72385763,6 4,6 C4.27614237,6 4.5,6.22385763 4.5,6.5 C4.5,6.77614237 4.27614237,7 4,7 Z M5.5,6.5 C5.22385763,6.5 5,6.27614237 5,6 C5,5.72385763 5.22385763,5.5 5.5,5.5 C5.77614237,5.5 6,5.72385763 6,6 C6,6.27614237 5.77614237,6.5 5.5,6.5 Z" id="Combined-Shape-Copy" fill="url(#linearGradient-5)" mask="url(#mask-4)"></path>
+                <rect id="Rectangle-1425-Copy" fill="url(#linearGradient-6)" mask="url(#mask-4)" x="0.5" y="3" width="7" height="2"></rect>
+                <circle id="Oval-292" fill="#FFFFFF" mask="url(#mask-4)" cx="4" cy="4" r="1"></circle>
+            </g>
+            <path d="M6.5,3.5 C6.5,3.5 8.5,3 10.5,3 C12.5,3 14.5,3.5 14.5,3.5 L14,5.5 C14,5.5 12.25,5 10.5,5 C8.75,5 7,5.5 7,5.5 L6.5,3.5 Z" id="Rectangle-1426" fill="url(#linearGradient-5)"></path>
+            <path d="M10.5,4.5 C10.2238576,4.5 10,4.27614237 10,4 C10,3.72385763 10.2238576,3.5 10.5,3.5 C10.7761424,3.5 11,3.72385763 11,4 C11,4.27614237 10.7761424,4.5 10.5,4.5 Z M12.5,4.5 C12.2238576,4.5 12,4.27614237 12,4 C12,3.72385763 12.2238576,3.5 12.5,3.5 C12.7761424,3.5 13,3.72385763 13,4 C13,4.27614237 12.7761424,4.5 12.5,4.5 Z M8.5,4.5 C8.22385763,4.5 8,4.27614237 8,4 C8,3.72385763 8.22385763,3.5 8.5,3.5 C8.77614237,3.5 9,3.72385763 9,4 C9,4.27614237 8.77614237,4.5 8.5,4.5 Z" id="Combined-Shape" fill="#5E5216"></path>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/BT.svg

@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>BT</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#FF5F38" offset="0%"></stop>
+            <stop stop-color="#FD5026" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#FFD951" offset="0%"></stop>
+            <stop stop-color="#FFD43B" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="BT">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask-Copy" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="15"></rect>
+            <polygon id="Rectangle-2" fill="url(#linearGradient-3)" points="0 15 21 0 0 0"></polygon>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/BV.svg

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>BV</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#F14247" offset="0%"></stop>
+            <stop stop-color="#ED2F35" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#0A3A85" offset="0%"></stop>
+            <stop stop-color="#032A67" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="BV">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask-Copy" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="15"></rect>
+            <polygon id="Rectangle-2" fill="url(#linearGradient-1)" points="0 9 6 9 6 15 9 15 9 9 21 9 21 6 9 6 9 0 6 0 6 6 0 6"></polygon>
+            <polygon id="Rectangle-2" fill="url(#linearGradient-3)" points="0 8 7 8 7 15 8 15 8 8 21 8 21 7 8 7 8 0 7 0 7 7 0 7"></polygon>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/CC.svg

@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>CC</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#229716" offset="0%"></stop>
+            <stop stop-color="#1C7E12" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#FFE244" offset="0%"></stop>
+            <stop stop-color="#FFDF32" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="CC">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="15"></rect>
+            <path d="M4,6 C2.8954305,6 2,5.1045695 2,4 C2,2.8954305 2.8954305,2 4,2 C5.1045695,2 6,2.8954305 6,4 C6,5.1045695 5.1045695,6 4,6 Z M4,4 C4.2082035,4 3.83990355,5.05443624 4,5 C4.26457858,4.91003759 5,3.67204063 5,3.5 C5,3.22385763 4.55228475,3 4,3 C3.44771525,3 3,3.22385763 3,3.5 C3,3.77614237 3.44771525,4 4,4 Z" id="Combined-Shape" fill="url(#linearGradient-3)"></path>
+            <polygon id="Star-2" fill="url(#linearGradient-3)" points="16 13 15.2928932 13.2071068 15.5 12.5 15.2928932 11.7928932 16 12 16.7071068 11.7928932 16.5 12.5 16.7071068 13.2071068"></polygon>
+            <polygon id="Star-2" fill="url(#linearGradient-3)" points="16 3.5 15.2928932 3.70710678 15.5 3 15.2928932 2.29289322 16 2.5 16.7071068 2.29289322 16.5 3 16.7071068 3.70710678"></polygon>
+            <polygon id="Star-2" fill="url(#linearGradient-3)" points="19 6.5 18.2928932 6.70710678 18.5 6 18.2928932 5.29289322 19 5.5 19.7071068 5.29289322 19.5 6 19.7071068 6.70710678"></polygon>
+            <polygon id="Star-2" fill="url(#linearGradient-3)" points="14 7.5 13.2928932 7.70710678 13.5 7 13.2928932 6.29289322 14 6.5 14.7071068 6.29289322 14.5 7 14.7071068 7.70710678"></polygon>
+            <polygon id="Star-2" fill="url(#linearGradient-3)" points="17.5 8.75 17.1464466 8.85355339 17.25 8.5 17.1464466 8.14644661 17.5 8.25 17.8535534 8.14644661 17.75 8.5 17.8535534 8.85355339"></polygon>
+            <path d="M12.0613625,5.54741025 C11.6335382,5.2048611 11.090693,5 10.5,5 C9.11928813,5 8,6.11928813 8,7.5 C8,8.88071187 9.11928813,10 10.5,10 C11.090693,10 11.6335382,9.7951389 12.0613625,9.45258975 C11.834734,9.53712452 11.58943,9.58333333 11.3333333,9.58333333 C10.1827401,9.58333333 9.25,8.65059323 9.25,7.5 C9.25,6.34940677 10.1827401,5.41666667 11.3333333,5.41666667 C11.58943,5.41666667 11.834734,5.46287548 12.0613625,5.54741025 L12.0613625,5.54741025 Z" id="Oval-12" fill="url(#linearGradient-3)"></path>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/CF.svg

@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>CF</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#083D96" offset="0%"></stop>
+            <stop stop-color="#053380" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#37AE39" offset="0%"></stop>
+            <stop stop-color="#2E9630" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-4">
+            <stop stop-color="#FFD13F" offset="0%"></stop>
+            <stop stop-color="#FFCD2F" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-5">
+            <stop stop-color="#E42346" offset="0%"></stop>
+            <stop stop-color="#D01739" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-6">
+            <stop stop-color="#FFD03B" offset="0%"></stop>
+            <stop stop-color="#FFCD2F" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="CF">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="4"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-3)" x="0" y="7" width="21" height="4"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-4)" x="0" y="11" width="21" height="4"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-1)" x="0" y="4" width="21" height="3"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-5)" x="8" y="0" width="5" height="15"></rect>
+            <polygon id="Star-8" fill="url(#linearGradient-6)" points="3.5 2.58500002 2.61832212 3.21352549 2.94363192 2.18077495 2.07341523 1.53647451 3.15614561 1.52672504 3.5 0.5 3.84385439 1.52672504 4.92658477 1.53647451 4.05636808 2.18077495 4.38167788 3.21352549"></polygon>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/CG.svg

@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>CG</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#F33630" offset="0%"></stop>
+            <stop stop-color="#DC241E" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#009643" offset="0%"></stop>
+            <stop stop-color="#09C15B" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-4">
+            <stop stop-color="#FCDF4A" offset="0%"></stop>
+            <stop stop-color="#FCE154" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="CG">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <g id="Group-2" transform="translate(-1.060000, -5.020000)">
+                <polygon id="Rectangle-74" fill="url(#linearGradient-2)" points="6.06152385 19.017348 21.0615238 5.01734803 22.0615238 5.01734803 22.0615238 20.017348 6.06152385 20.017348"></polygon>
+                <polygon id="Rectangle-74-Copy" fill="url(#linearGradient-3)" transform="translate(9.061524, 12.517348) scale(-1, -1) translate(-9.061524, -12.517348) " points="1.06152385 19.017348 16.0615238 5.01734803 17.0615238 5.01734803 17.0615238 20.017348 1.06152385 20.017348"></polygon>
+                <polygon id="Rectangle-69-Copy" fill="url(#linearGradient-4)" transform="translate(11.870896, 12.167073) rotate(134.000000) translate(-11.870896, -12.167073) " points="-2.62910413 9.66707303 26.3708959 9.66707303 26.3708959 14.667073 -2.62910413 14.667073"></polygon>
+            </g>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/CI.svg

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>CI</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#1DC87D" offset="0%"></stop>
+            <stop stop-color="#169E62" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#F89242" offset="0%"></stop>
+            <stop stop-color="#F67F22" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="CI">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask" fill="url(#linearGradient-2)" x="10" y="0" width="11" height="15"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-3)" x="0" y="0" width="7" height="15"></rect>
+            <rect id="Rectangle-2-Copy" fill="url(#linearGradient-1)" x="7" y="0" width="7" height="15"></rect>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/CK.svg

@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>CK</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#0A17A7" offset="0%"></stop>
+            <stop stop-color="#030E88" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#DB1E36" offset="0%"></stop>
+            <stop stop-color="#D51931" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="CK">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask-Copy" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="15"></rect>
+            <path d="M3,3.22996746 L-1.3516287,-0.5 L0.660232527,-0.5 L4.16023253,2 L4.85660189,2 L9.5,-0.902123821 L9.5,0.25 C9.5,0.552509227 9.33308555,0.876533554 9.08215972,1.05576629 L6,3.25730895 L6,3.77003254 L9.13722049,6.45907867 C9.59934261,6.85518335 9.34102897,7.5 8.75,7.5 C8.50478614,7.5 8.2052751,7.40393402 8.00092153,7.25796718 L4.83976747,5 L4.14339811,5 L-0.5,7.90212382 L-0.5,6.24269105 L3,3.74269105 L3,3.22996746 Z" id="Rectangle-36" fill="url(#linearGradient-1)" fill-rule="nonzero"></path>
+            <path d="M3.5,3 L-4.4408921e-16,7.10542736e-15 L0.5,7.10542736e-15 L4,2.5 L5,2.5 L9,7.10542736e-15 L9,0.25 C9,0.388071187 8.91348267,0.561798096 8.79154062,0.648899555 L5.5,3 L5.5,4 L8.8118248,6.83870697 C8.91575109,6.92778665 8.8840332,7 8.75,7 L8.75,7 C8.61192881,7 8.41348267,6.9382019 8.29154062,6.85110044 L5,4.5 L4,4.5 L-4.4408921e-16,7 L-4.4408921e-16,6.5 L3.5,4 L3.5,3 Z" id="Rectangle-36" fill="url(#linearGradient-3)"></path>
+            <path d="M-4.4408921e-16,2.5 L-4.4408921e-16,4.5 L3.5,4.5 L3.5,7.00461102 C3.5,7.2782068 3.71403503,7.5 4.00468445,7.5 L4.99531555,7.5 C5.27404508,7.5 5.5,7.2842474 5.5,7.00461102 L5.5,4.5 L9.00952148,4.5 C9.28040529,4.5 9.5,4.28596497 9.5,3.99531555 L9.5,3.00468445 C9.5,2.72595492 9.28494263,2.5 9.00952148,2.5 L5.5,2.5 L5.5,7.10542736e-15 L3.5,7.10542736e-15 L3.5,2.5 L-4.4408921e-16,2.5 Z" id="Rectangle-2" fill="url(#linearGradient-1)"></path>
+            <polygon id="Rectangle-36" fill="url(#linearGradient-3)" points="-4.4408921e-16 3 4 3 4 2.5 4 7.10542736e-15 5 7.10542736e-15 5 2.5 5 3 9 3 9 4 5 4 5 4.5 5 7 4 7 4 4.5 4 4 -4.4408921e-16 4"></polygon>
+            <path d="M15.5,5 C15.2238576,5 15,4.77614237 15,4.5 C15,4.22385763 15.2238576,4 15.5,4 C15.7761424,4 16,4.22385763 16,4.5 C16,4.77614237 15.7761424,5 15.5,5 Z M15.5,11 C15.2238576,11 15,10.7761424 15,10.5 C15,10.2238576 15.2238576,10 15.5,10 C15.7761424,10 16,10.2238576 16,10.5 C16,10.7761424 15.7761424,11 15.5,11 Z M13,7.5 C13,7.77614237 12.7761424,8 12.5,8 C12.2238576,8 12,7.77614237 12,7.5 C12,7.22385763 12.2238576,7 12.5,7 C12.7761424,7 13,7.22385763 13,7.5 Z M19,7.5 C19,7.77614237 18.7761424,8 18.5,8 C18.2238576,8 18,7.77614237 18,7.5 C18,7.22385763 18.2238576,7 18.5,7 C18.7761424,7 19,7.22385763 19,7.5 Z M13.732233,9.26776695 C13.9274952,9.4630291 13.9274952,9.77961159 13.732233,9.97487373 C13.5369709,10.1701359 13.2203884,10.1701359 13.0251263,9.97487373 C12.8298641,9.77961159 12.8298641,9.4630291 13.0251263,9.26776695 C13.2203884,9.07250481 13.5369709,9.07250481 13.732233,9.26776695 Z M17.9748737,5.02512627 C18.1701359,5.22038841 18.1701359,5.5369709 17.9748737,5.73223305 C17.7796116,5.92749519 17.4630291,5.92749519 17.267767,5.73223305 C17.0725048,5.5369709 17.0725048,5.22038841 17.267767,5.02512627 C17.4630291,4.82986412 17.7796116,4.82986412 17.9748737,5.02512627 Z M17.267767,9.26776695 C17.4630291,9.07250481 17.7796116,9.07250481 17.9748737,9.26776695 C18.1701359,9.4630291 18.1701359,9.77961159 17.9748737,9.97487373 C17.7796116,10.1701359 17.4630291,10.1701359 17.267767,9.97487373 C17.0725048,9.77961159 17.0725048,9.4630291 17.267767,9.26776695 Z M13.0251263,5.02512627 C13.2203884,4.82986412 13.5369709,4.82986412 13.732233,5.02512627 C13.9274952,5.22038841 13.9274952,5.5369709 13.732233,5.73223305 C13.5369709,5.92749519 13.2203884,5.92749519 13.0251263,5.73223305 C12.8298641,5.5369709 12.8298641,5.22038841 13.0251263,5.02512627 Z" id="Combined-Shape" fill="#FFFFFF"></path>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/CM.svg

@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>CM</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#FFDC44" offset="0%"></stop>
+            <stop stop-color="#FDD216" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#059170" offset="0%"></stop>
+            <stop stop-color="#007B5E" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-4">
+            <stop stop-color="#E21A30" offset="0%"></stop>
+            <stop stop-color="#CE1126" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-5">
+            <stop stop-color="#FFDC42" offset="0%"></stop>
+            <stop stop-color="#FDD217" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="CM">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask" fill="url(#linearGradient-2)" x="10" y="0" width="11" height="15"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-3)" x="0" y="0" width="7" height="15"></rect>
+            <rect id="Rectangle-2-Copy" fill="url(#linearGradient-4)" x="7" y="0" width="7" height="15"></rect>
+            <rect id="Rectangle-2-Copy-2" fill="url(#linearGradient-2)" x="14" y="0" width="7" height="15"></rect>
+            <polygon id="Star-8" fill="url(#linearGradient-5)" points="10.5 8.47500004 9.03053687 9.52254249 9.57271986 7.80129158 8.12235871 6.72745751 9.92690936 6.7112084 10.5 5 11.0730906 6.7112084 12.8776413 6.72745751 11.4272801 7.80129158 11.9694631 9.52254249"></polygon>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/CU.svg

@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>CU</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#0B389F" offset="0%"></stop>
+            <stop stop-color="#052E8D" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#E12A43" offset="0%"></stop>
+            <stop stop-color="#CD1931" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="CU">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="3"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-2)" x="0" y="6" width="21" height="3"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-1)" x="0" y="3" width="21" height="3"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-2)" x="0" y="12" width="21" height="3"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-1)" x="0" y="9" width="21" height="3"></rect>
+            <polygon id="Rectangle-83" fill="url(#linearGradient-3)" points="0 0 10 7.5 0 15"></polygon>
+            <polygon id="Star-53" fill="url(#linearGradient-1)" points="3.5 8.26701627 2.3244295 9.11803399 2.77052418 7.73702106 1.59788697 6.88196601 3.04915915 6.8794708 3.5 5.5 3.95084085 6.8794708 5.40211303 6.88196601 4.22947582 7.73702106 4.6755705 9.11803399"></polygon>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/CV.svg

@@ -0,0 +1,30 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>CV</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#0C49AE" offset="0%"></stop>
+            <stop stop-color="#063B91" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#CD232E" offset="0%"></stop>
+            <stop stop-color="#CD232E" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="CV">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="8"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-2)" x="0" y="11" width="21" height="4"></rect>
+            <rect id="Rectangle-2" fill="url(#linearGradient-1)" x="0" y="8" width="21" height="3"></rect>
+            <rect id="Rectangle-2-Copy-4" fill="url(#linearGradient-3)" x="0" y="9" width="21" height="1"></rect>
+            <path d="M8,13 C7.72385763,13 7.5,12.7761424 7.5,12.5 C7.5,12.2238576 7.72385763,12 8,12 C8.28367896,12 8.56025161,11.9529391 8.82192552,11.8618903 C9.08273128,11.7711436 9.36772087,11.9090037 9.45846757,12.1698095 C9.54921428,12.4306153 9.41135418,12.7156048 9.15054841,12.8063515 C8.78356688,12.9340418 8.39593675,13 8,13 Z M10.6511931,11.7850663 C10.906745,11.4887971 11.1113949,11.1516075 11.255598,10.7871258 C11.3571885,10.5303497 11.2313858,10.2398361 10.9746097,10.1382455 C10.7178336,10.036655 10.42732,10.1624577 10.3257294,10.4192338 C10.2228617,10.6792381 10.076689,10.9200782 9.89396942,11.1319106 C9.71360547,11.3410122 9.73690189,11.6567364 9.94600344,11.8371003 C10.155105,12.0174643 10.4708291,11.9941678 10.6511931,11.7850663 Z M11.4681136,9.02598701 C11.4151393,8.63525776 11.2969147,8.25940768 11.1195772,7.91169522 C10.9941162,7.66569899 10.6929906,7.56798589 10.4469943,7.69344691 C10.2009981,7.81890792 10.103285,8.12003351 10.228746,8.36602974 C10.3551834,8.6139404 10.4393986,8.88167049 10.4771796,9.16033603 C10.514279,9.43397492 10.7661822,9.62572801 11.0398211,9.58862856 C11.31346,9.5515291 11.5052131,9.2996259 11.4681136,9.02598701 Z M9.85663172,6.53255799 C9.52534086,6.32490498 9.16108865,6.1738376 8.77747146,6.08677105 C8.50817789,6.02565162 8.24032524,6.19441011 8.17920581,6.46370368 C8.11808639,6.73299725 8.28684488,7.00084991 8.55613845,7.06196933 C8.82950869,7.12401401 9.0891154,7.23168146 9.32553666,7.37987023 C9.55951548,7.52652808 9.86808247,7.45574046 10.0147403,7.22176164 C10.1613982,6.98778282 10.0906105,6.67921584 9.85663172,6.53255799 Z M7.0575528,6.12848171 C6.67912609,6.23407333 6.32257836,6.40271264 6.0015931,6.62628761 C5.77499938,6.7841163 5.71925431,7.09575224 5.87708301,7.32234596 C6.0349117,7.54893969 6.34654764,7.60468475 6.57314136,7.44685606 C6.80235338,7.28720365 7.05662191,7.16694018 7.32631439,7.09168844 C7.59229658,7.01747198 7.74775343,6.74168648 7.67353696,6.47570428 C7.5993205,6.20972209 7.323535,6.05426525 7.0575528,6.12848171 Z M4.84980403,7.9732204 C4.6794218,8.32421179 4.56864103,8.70226234 4.52331764,9.09421416 C4.49159725,9.36852863 4.68825862,9.6166189 4.96257309,9.64833928 C5.23688756,9.68005966 5.48497782,9.4833983 5.51669821,9.20908383 C5.54903512,8.9294377 5.62794951,8.6601344 5.74941219,8.40991841 C5.87000302,8.16149848 5.76637705,7.86235615 5.51795712,7.74176532 C5.26953719,7.6211745 4.97039486,7.72480046 4.84980403,7.9732204 Z M4.79030361,10.8975596 C4.94684558,11.256651 5.16282722,11.5866698 5.42825784,11.874078 C5.61560955,12.0769424 5.93194217,12.0895179 6.13480653,11.9021661 C6.33767089,11.7148144 6.35024638,11.3984818 6.16289467,11.1956174 C5.97304982,10.9900535 5.81870545,10.7542161 5.70698559,10.4979421 C5.59663426,10.2448073 5.30197059,10.1290585 5.04883585,10.2394098 C4.79570111,10.3497611 4.67995228,10.6444248 4.79030361,10.8975596 Z M6.93580227,12.8351354 C6.67271015,12.7512477 6.52743627,12.469965 6.61132398,12.2068729 C6.69521168,11.9437808 6.97649441,11.7985069 7.23958653,11.8823946 C7.46870828,11.9554507 7.70854545,11.9951777 7.954027,11.9995874 C8.23012484,12.0045471 8.44992573,12.2323893 8.44496604,12.5084871 C8.44000635,12.7845849 8.21216421,13.0043858 7.93606638,12.9994261 C7.59324509,12.9932679 7.25713989,12.9375949 6.93580227,12.8351354 Z" id="Oval-73" fill="#F7D035" fill-rule="nonzero"></path>
+        </g>
+    </g>
+</svg>

packages/webapp/public/icons/flags/CW.svg

@@ -0,0 +1,29 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="21px" height="15px" viewBox="0 0 21 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 46 (44423) - http://www.bohemiancoding.com/sketch -->
+    <title>CW</title>
+    <desc>Created with sketchtool.</desc>
+    <defs>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F0F0F0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#0543A8" offset="0%"></stop>
+            <stop stop-color="#00307D" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#FCC747" offset="0%"></stop>
+            <stop stop-color="#FEC539" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="CW">
+            <rect id="FlagBackground" fill="url(#linearGradient-1)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Mask-Copy" fill="url(#linearGradient-2)" x="0" y="0" width="21" height="15"></rect>
+            <rect id="Rectangle-1337" fill="url(#linearGradient-3)" x="0" y="10" width="21" height="2"></rect>
+            <polygon id="Star-53" fill="url(#linearGradient-1)" points="6.5 6.26701627 5.3244295 7.11803399 5.77052418 5.73702106 4.59788697 4.88196601 6.04915915 4.8794708 6.5 3.5 6.95084085 4.8794708 8.40211303 4.88196601 7.22947582 5.73702106 7.6755705 7.11803399"></polygon>
+            <polygon id="Star-53-Copy" fill="url(#linearGradient-1)" points="3 3.5752622 2.11832212 4.21352549 2.45289314 3.1777658 1.57341523 2.53647451 2.66186936 2.5346031 3 1.5 3.33813064 2.5346031 4.42658477 2.53647451 3.54710686 3.1777658 3.88167788 4.21352549"></polygon>
+        </g>
+    </g>
+</svg>