✨ Isolate Language Component in Library

[keithrfung]

Is there an existing issue for this?

• I have searched the existing issues

Suggestion

The json files in lang in library should be within the app projects.

For example

📂 admin-app
    📂 src
         📂 lang
             en.json
             MessageId.ts
📂 result-app
    📂 src
         📂 lang
             en.json
             MessageId.ts

This actually means a lot of changes on the BaseComponents to allow this. The idea is to create a Language component that can be reused without duplicating code between the app applications.

Possible Implementation

Example of a Generic Message

import { MessageDescriptor } from '@formatjs/intl';

const OverloadMessageId = 'overload';

const PlaceHolderMessageId = 'placeholder';

const placeholderMessage = 'Message Not Found';

export default class GenericMessage<T extends string | number> implements MessageDescriptor {
    id: T | typeof OverloadMessageId | typeof PlaceHolderMessageId;

    defaultMessage: string;

    description?: string;

    constructor(
        id: T | typeof OverloadMessageId | typeof PlaceHolderMessageId = PlaceHolderMessageId,
        defaultMessage = placeholderMessage,
        description?: string
    ) {
        this.id = id;
        this.defaultMessage = defaultMessage;
        this.description = description;
    }
}

export type GenericMessageDescriptor = MessageDescriptor;

Example of a generic piece to pull the languages from library.

import EnumDictionary from '@electionguard-ui/library/src/utils/EnumDictionary';

import Locale from './Locale';
import Language from './Language';

/**
 * Get language for locale based on list of supported languages
 * @param supportedLanguages
 * @returns Language
 */
const getLanguage = (supportedLanguages: EnumDictionary<Locale, Language>): Language => {
    const locale = navigator.language;

    if (locale in Locale) {
        return supportedLanguages[locale as Locale];
    }

    return supportedLanguages.default;
};

export default getLanguage;

Anything else?

No response

[deepto98]

@keithrfung I'd like to pick this up as well, can you assign this to me?

[keithrfung]

@deepto98 you got it

[keithrfung]

@deepto98 How is the progress on this? I have a couple issues I want to assign that depend on this.

[deepto98]

@keithrfung Hi, I've set up the project locally, but was a bit busy with work through the week. I'll try to get this done today, and will keep you updated

[keithrfung]

@deepto98 I'm gonna pick up this card because we need to push this piece through for some more work