an instantaneous translation application between two people, one of whom is allophone, for Android and MacOS smartphone or tablet.
[[TOC]]
The purpose of this application is describe in the documentation
This project is the frontend of the application. The backend is petranslate-back project. Checks readme to install it.
| Node, Angular | Version |
|---|---|
| Node | 20.9 |
| angular/cli | 17.3.1 |
| firebase tools | 13.0.3 |
- under src, create the folder environments.
- under the new folder src/environments, create files: environment.ts, authflow.ts and params.ts
- fill the environment.ts and authflow.ts files with setting data, example:
environement.ts
export const environment = {
name: 'os',
production: false,
firebaseConfig: {
apiKey: 'XXXX',
authDomain: 'XXXX',
projectId: 'XXXX',
storageBucket: 'XXXX',
messagingSenderId: 'XXXX',
appId: 'XXXX',
},
gcp: {
gateWayUrl: 'XXXX',
},
microsoftSpeechConfig: {
speechToTextEnabled: false,
textToSpeechEnabled: false,
key: 'XXXX',
defaultEndpoint: 'XXXX',
endpoints: {
'XXXX': 'XXXX'
'XXXX': 'XXXX'
},
region: 'XXXX',
}
};
authflow.ts
import { AuthConfig } from 'angular-oauth2-oidc';
export const authCodeFlowConfig: AuthConfig = {
};
params.ts
export const params = {
defaultPassword: 'XXXX',
excludedLanguagesFromAzureSTT: [
'en-PK',
'bn-BD',
'ta-MY',
'ta-SG',
'ta-LK',
'ur-PK',
],
languesPrioritaires: [
'en-GB',
'es-ES',
'de-DE',
'it-IT',
'nl-NL',
'pt-PT',
'ja-JP',
'ar-XA',
'zh-CN',
'jv-ID',
]
// Use Login/Password Authentification
oauthIdProvider: '',
// Use google authent (for test)
// oauthIdProvider: 'google.com',
// Use OIDC authent
// oauthIdProvider: 'oidc.idp-provider',
oauthIdProvider: '',
doubleAuth: false,
authType: AuthType.loginPassword,
organization: {
name: 'XXXX',
organizationUser: 'Conseiller',
etabsDomain: ' ',
officalDomain: ' ',
cgus: "Nous utilisons des cookies pour nous assurer de votre sécurité. Nous n'utilisons pas de cookies pour vous conseiller et nous ne vendons pas vos données à des tiers.",
cgusEnglish: `We use cookies to ensure your security. We do not use cookies to advise you and we do not sell your data to third parties.`,
},
subtitle: 'XXXX',
};
| Name | Description |
|---|---|
| firebaseConfig | your app's Firebase project configuration |
| gcp.gateWayUrl | the gateway's url for your gcp backend project |
| firebaseConfig | your app's Firebase project configuration |
| microsoftSpeechConfig | settings for the microsoft azure speech to text api even when microsoftSpeechConfig.speechToTextEnabled is true |
| microsoftSpeechConfig.speechToTextEnabled | converting voice to text will use the azure speech to text api if true, false otherwise |
| microsoftSpeechConfig.textToSpeechEnabled | converting text to voice will use the azure text to speech api if true, false otherwise |
| microsoftSpeechConfig.key | the microsoft azure speech to text api key |
| microsoftSpeechConfig.defaultEndpoint | default endpoint for microsoft azure speech to text api |
| microsoftSpeechConfig.endpoints | endpoint of a specific language for microsoft azure speech to text api |
| microsoftSpeechConfig.region | the microsoft azure speech to text api region |
| Name | Description |
|---|---|
| defaultPassword | the default password used to create a new firebase user account Not needed if firebase login is activated |
| excludedLanguagesFromAzureSTT | the excludedLanguages will continue to use the google api for the speech to text api even if the microsoft azure api is enabled |
| languesPrioritaires | list of languages on home page |
| oauthIdProvider | OAuth Provider ID used for authentication (let empty for login/password) |
| authType | Enum which define if we use authentication via login/password, via SSO, or both of them |
| headerButtons.indicators | Display indicators button in the header page |
| headerButtons.choice | Display indicators choice in the header page |
| headerButtons.CGU | Display CGU button in the header page |
| headerButtons.modality | Display modality button in the header page |
| headerButtons.personalData | Display personalData button in the header page |
| headerButtons.startGuide | Display startGuide button in the header page |
| headerButtons.contact | Display contact button in the header page |
| organization.name | your organization name |
| organization.organizationUser | Main user of your app |
| organization.cgus | your organisation's General Conditions of Use (GCU) in french |
| organization.cgusEnglish | your organisation's General Conditions of Use (GCU) in english |
| subtitle | your subtitle in the header |
The default authentication mode is the firebase authentication with firestore.
This mode is enabled when the authCodeFlowConfig.loginUrl param in the authflow.ts file is not defined.
Otherwise,when authCodeFlowConfig.loginUrl is defined, it means that authentication is based on the open id connect, using the authorization code flow.
So you need to have an authentication server,set the loginUrl and others settings in authCodeFlowConfig to setup your sso environment and initialise the authentication code flow.
Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.
To get more help on the Angular CLI use ng help or go check out the Angular CLI README.
1 - Build
$ npm run build:[dev|uat|prod]
2 - TEST on local
3 - Deploy
$ firebase deploy --project [dev|uat|prod]
4 - TEST
$ https://$GCP_PROJECT.firebaseapp.com
5 - TEST with Product owner
For active contributors who want to use this repository as their main one, we have an active push functionality on our internal repository which contains our CI/CD to directly deploy the application on our open-source domain.
If you want to participate, please follow the next steps. For security, pushing on master is disallowed.
To create a feature branch and automatically push it to our related gitlab repository, please follow the following steps :
1 - Create the feature branch from master. Change feature_branch with the name of the branch you want to create
$ git pull
$ git checkout -b feature_branch master
2 - Make your devs and test them locally
3 - Update sinc-to-gitlab.yml file. Remove all feature_test occurrences and replace them with your branch name
name: Sync to Private Repo
on:
push:
branches:
- feature_test # Change this to the branch you want to push
jobs:
sync:
runs-on: ubuntu-latest
steps:
- name: Checkout source repository
uses: actions/checkout@v2
with:
fetch-depth: 1
- name: Clone the target repository
run: |
git clone https://oauth2:${{ secrets.GITLAB_TOKEN }}@gitlab.com/petranslate/trademploi-front.git
cd trademploi-front
git remote add source https://github.com/France-Travail/TradEmploi-FrontEnd.git
git fetch source
git checkout -b feature_test source/feature_test # Change this to the branch you want to push
git push origin feature_test # Change this to the branch you want to push
env:
token: ${{ secrets.GITLAB_TOKEN }}
4 - Commit and push your changes (all your files + sinc-to-gitlab.yml) on your new branch.
5 - Verify in the github actions that you workflow succeed
6 - Create a Merge Request to merge your changes in master, after the validation of the development team