diff --git a/package.json b/package.json index f753a31bd..33e2e94ca 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,8 @@ "@angular/platform-browser-dynamic": "^19.2.0", "@angular/router": "^19.2.0", "@angular/service-worker": "^19.2.0", + "@ngx-translate/core": "^16.0.4", + "@ngx-translate/http-loader": "^16.0.1", "@ngxs/devtools-plugin": "^19.0.0", "@ngxs/logger-plugin": "^19.0.0", "@ngxs/store": "^19.0.0", diff --git a/src/app/app.config.ts b/src/app/app.config.ts index db007ae47..138c2eae3 100644 --- a/src/app/app.config.ts +++ b/src/app/app.config.ts @@ -1,4 +1,8 @@ -import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core'; +import { + ApplicationConfig, + importProvidersFrom, + provideZoneChangeDetection, +} from '@angular/core'; import { provideRouter } from '@angular/router'; import { routes } from './app.routes'; import { provideStore } from '@ngxs/store'; @@ -10,6 +14,8 @@ import { provideHttpClient } from '@angular/common/http'; import { ConfirmationService } from 'primeng/api'; import { STATES } from '@core/constants/ngxs-states.constant'; import { provideServiceWorker } from '@angular/service-worker'; +import { provideTranslation } from '@core/helpers/i18n.helper'; +import { TranslateModule } from '@ngx-translate/core'; export const appConfig: ApplicationConfig = { providers: [ @@ -35,5 +41,6 @@ export const appConfig: ApplicationConfig = { registrationStrategy: 'registerWhenStable:30000', }), ConfirmationService, + importProvidersFrom(TranslateModule.forRoot(provideTranslation())), ], }; diff --git a/src/app/app.module.ts b/src/app/app.module.ts deleted file mode 100644 index a954734fc..000000000 --- a/src/app/app.module.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { NgModule } from '@angular/core'; -import { NgxsModule } from '@ngxs/store'; -import { AuthState } from '@core/store/auth'; -import { AddonsState } from '@osf/features/settings/addons/store'; -import { SearchState } from '@osf/features/search/store'; -import { TokensState } from '@osf/features/settings/tokens/store'; - -@NgModule({ - imports: [ - NgxsModule.forRoot([AuthState, TokensState, AddonsState, SearchState]), - ], -}) -export class AppModule {} diff --git a/src/app/core/components/footer/footer.component.html b/src/app/core/components/footer/footer.component.html index dda295506..fd5ac9aba 100644 --- a/src/app/core/components/footer/footer.component.html +++ b/src/app/core/components/footer/footer.component.html @@ -2,16 +2,23 @@
- Center for Open Science + {{ "footer.links.centerForOpenScience" | translate }} | - Reproducibility Project: Psychology + {{ + "footer.links.reproducibilityProjectPsychology" | translate + }} | - Reproducibility Project: Cancer Biology + {{ + "footer.links.reproducibilityProjectCancerBiology" | translate + }}
@for (icon of socialIcons; track icon.name) { - + social media icon
- Terms of Use + {{ + "footer.links.termsOfUse" | translate + }} | - Privacy Policy + {{ + "footer.links.privacyPolicy" | translate + }} | - Status + {{ "footer.links.status" | translate }} | - API + {{ "footer.links.api" | translate }} | - TOP Guidelines + {{ "footer.links.topGuidelines" | translate }}
-
Copyright © 2011-2025
+
{{ "footer.copyright" | translate }}
diff --git a/src/app/core/components/footer/footer.component.ts b/src/app/core/components/footer/footer.component.ts index bc73670aa..d6c20d2e9 100644 --- a/src/app/core/components/footer/footer.component.ts +++ b/src/app/core/components/footer/footer.component.ts @@ -4,11 +4,12 @@ import { RouterLink } from '@angular/router'; import { IS_PORTRAIT, IS_XSMALL } from '@shared/utils/breakpoints.tokens'; import { toSignal } from '@angular/core/rxjs-interop'; import { NgOptimizedImage } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ standalone: true, selector: 'osf-footer', - imports: [RouterLink, NgOptimizedImage], + imports: [RouterLink, NgOptimizedImage, TranslateModule], templateUrl: './footer.component.html', styleUrl: './footer.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/src/app/core/components/header/header.component.html b/src/app/core/components/header/header.component.html index 3a44fcb72..16da5e231 100644 --- a/src/app/core/components/header/header.component.html +++ b/src/app/core/components/header/header.component.html @@ -1,5 +1,5 @@ - +
@@ -7,5 +7,9 @@ - + + + {{ item.label | translate }} + +
diff --git a/src/app/core/components/header/header.component.ts b/src/app/core/components/header/header.component.ts index d4d5bd91d..baad28af9 100644 --- a/src/app/core/components/header/header.component.ts +++ b/src/app/core/components/header/header.component.ts @@ -12,11 +12,18 @@ import { MenuModule } from 'primeng/menu'; import { ButtonModule } from 'primeng/button'; import { Store } from '@ngxs/store'; import { UserSelectors } from '@core/store/user/user.selectors'; +import { TranslatePipe } from '@ngx-translate/core'; @Component({ standalone: true, selector: 'osf-header', - imports: [RouterLink, BreadcrumbComponent, MenuModule, ButtonModule], + imports: [ + BreadcrumbComponent, + MenuModule, + ButtonModule, + TranslatePipe, + RouterLink, + ], templateUrl: './header.component.html', styleUrl: './header.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, @@ -28,17 +35,19 @@ export class HeaderComponent { items = [ { - label: 'My profile', + label: 'navigation.myProfile', command: () => this.#router.navigate(['my-profile']), }, - { label: 'Settings', command: () => console.log('Settings') }, - { label: 'Log out', command: () => console.log('Log out') }, + { label: 'navigation.settings', command: () => console.log('Settings') }, + { label: 'navigation.logOut', command: () => console.log('Log out') }, ]; #currentUrl = toSignal(this.#router.events.pipe(map(() => this.#router.url))); protected readonly authButtonText = computed(() => - this.#currentUrl()?.includes('sign-up') ? 'Sign In' : 'Sign Up', + this.#currentUrl()?.includes('sign-up') + ? 'navigation.signIn' + : 'navigation.signUp', ); protected readonly authButtonLink = computed(() => diff --git a/src/app/core/components/nav-menu/nav-menu.component.html b/src/app/core/components/nav-menu/nav-menu.component.html index 5b8a45b74..7c2677c32 100644 --- a/src/app/core/components/nav-menu/nav-menu.component.html +++ b/src/app/core/components/nav-menu/nav-menu.component.html @@ -5,15 +5,19 @@ [routerLink]="item.routerLink" routerLinkActive="active" [routerLinkActiveOptions]="{ - exact: item.label !== 'My Projects' ? item.useExactMatch : true, + exact: + item.label !== 'navigation.myProjects' ? item.useExactMatch : true, }" class="nav-link flex" - [class.mt-5]="item.label === 'Settings' || item.label === 'My Projects'" + [class.mt-5]=" + item.label === 'navigation.settings' || + item.label === 'navigation.myProjects' + " > @if (item.icon) { } - {{ item.label }} + {{ item.label | translate }} @if (item.items) { - @if (item.label === "My Projects" && isProjectRoute()) { + @if (item.label === "navigation.myProjects" && isProjectRoute()) {
@@ -39,7 +43,7 @@ @if (item.icon) { } - {{ item.label }} + {{ item.label | translate }} @if (item.items) { -

Forgot Your Password?

-

Enter your email address and we'll send a link to reset your password

+

{{ "auth.forgotPassword.title" | translate }}

+

{{ "auth.forgotPassword.description" | translate }}

- +
@@ -27,7 +27,7 @@

Forgot Your Password?

} diff --git a/src/app/features/auth/forgot-password/forgot-password.component.ts b/src/app/features/auth/forgot-password/forgot-password.component.ts index 897144f09..848e49df6 100644 --- a/src/app/features/auth/forgot-password/forgot-password.component.ts +++ b/src/app/features/auth/forgot-password/forgot-password.component.ts @@ -7,11 +7,12 @@ import { Message } from 'primeng/message'; import { ForgotPasswordFormGroupType } from '@osf/features/auth/forgot-password/forgot-password-form-group.type'; import { IS_XSMALL } from '@shared/utils/breakpoints.tokens'; import { toSignal } from '@angular/core/rxjs-interop'; +import { TranslatePipe } from '@ngx-translate/core'; @Component({ selector: 'osf-forgot-password', standalone: true, - imports: [InputText, ReactiveFormsModule, Button, Message], + imports: [InputText, ReactiveFormsModule, Button, Message, TranslatePipe], templateUrl: './forgot-password.component.html', styleUrl: './forgot-password.component.scss', }) @@ -29,12 +30,12 @@ export class ForgotPasswordComponent { if (this.forgotPasswordForm.valid) { this.message.set({ severity: 'success', - content: 'Thanks. Check your email to reset your password.', + content: 'auth.forgotPassword.messages.success', }); // this.message.set({ // severity: 'error', - // content: 'Email not found.', + // content: 'auth.forgotPassword.messages.error' // }); } } diff --git a/src/app/features/auth/reset-password/reset-password.component.html b/src/app/features/auth/reset-password/reset-password.component.html index dab201213..31549653f 100644 --- a/src/app/features/auth/reset-password/reset-password.component.html +++ b/src/app/features/auth/reset-password/reset-password.component.html @@ -1,10 +1,12 @@ @if (!isFormSubmitted()) {
-

Reset Password

+

{{ "auth.resetPassword.title" | translate }}

- + Reset Password
- + Reset Password "passwordMismatch" ] && resetPasswordForm.get("confirmNewPassword")?.touched ) { - Passwords must match + {{ + "auth.common.password.mismatch" | translate + }} }
} @else {
-

Thank You!

-

You have successfully reset your password

+

{{ "auth.resetPassword.success.title" | translate }}

+

+ {{ "auth.resetPassword.success.message" | translate }} +

diff --git a/src/app/features/auth/reset-password/reset-password.component.ts b/src/app/features/auth/reset-password/reset-password.component.ts index c62c53e2f..6be1d077b 100644 --- a/src/app/features/auth/reset-password/reset-password.component.ts +++ b/src/app/features/auth/reset-password/reset-password.component.ts @@ -11,6 +11,7 @@ import { PasswordInputHintComponent } from '@shared/components/password-input-hi import { ResetPasswordFormGroupType } from './reset-password-form-group.type'; import { IS_XSMALL } from '@shared/utils/breakpoints.tokens'; import { toSignal } from '@angular/core/rxjs-interop'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'osf-reset-password', @@ -21,6 +22,7 @@ import { toSignal } from '@angular/core/rxjs-interop'; ReactiveFormsModule, RouterLink, PasswordInputHintComponent, + TranslateModule, ], templateUrl: './reset-password.component.html', styleUrl: './reset-password.component.scss', diff --git a/src/app/features/auth/sign-up/sign-up.component.html b/src/app/features/auth/sign-up/sign-up.component.html index 82f04cba7..12bf7876a 100644 --- a/src/app/features/auth/sign-up/sign-up.component.html +++ b/src/app/features/auth/sign-up/sign-up.component.html @@ -1,10 +1,13 @@ @if (!isFormSubmitted()) {
@@ -100,14 +118,14 @@

Create A Free Account

} @else {
-

Registration successful

-

Check your email to confirm your account

+

{{ "auth.signUp.success.title" | translate }}

+

{{ "auth.signUp.success.message" | translate }}

} diff --git a/src/app/features/auth/sign-up/sign-up.component.ts b/src/app/features/auth/sign-up/sign-up.component.ts index f7cdc2cf0..bee910f84 100644 --- a/src/app/features/auth/sign-up/sign-up.component.ts +++ b/src/app/features/auth/sign-up/sign-up.component.ts @@ -16,6 +16,7 @@ import { Router, RouterLink } from '@angular/router'; import { PasswordInputHintComponent } from '@shared/components/password-input-hint/password-input-hint.component'; import { IS_XSMALL } from '@shared/utils/breakpoints.tokens'; import { toSignal } from '@angular/core/rxjs-interop'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'osf-sign-up', @@ -31,6 +32,7 @@ import { toSignal } from '@angular/core/rxjs-interop'; NgOptimizedImage, RouterLink, PasswordInputHintComponent, + TranslateModule, ], templateUrl: './sign-up.component.html', styleUrl: './sign-up.component.scss', diff --git a/src/app/features/home/home.component.html b/src/app/features/home/home.component.html index bb496f3d0..b0b1a80ab 100644 --- a/src/app/features/home/home.component.html +++ b/src/app/features/home/home.component.html @@ -5,16 +5,23 @@ >

- Go to My Projects to organize your work or - search OSF + {{ "home.loggedIn.dashboard.quickSearch.goTo" | translate }} + + {{ "home.loggedIn.dashboard.quickSearch.myProjects" | translate }} + + {{ "home.loggedIn.dashboard.quickSearch.toOrganize" | translate }} + + {{ "home.loggedIn.dashboard.quickSearch.search" | translate }} + + {{ "home.loggedIn.dashboard.quickSearch.osf" | translate }}

-

Discover Public Projects

+

{{ "home.loggedIn.publicProjects.title" | translate }}

-

Browse the latest research

-

- Check out the latest preprints hosted on OSF covering a variety of - research areas -

+

{{ "home.loggedIn.latestResearch.title" | translate }}

+

{{ "home.loggedIn.latestResearch.subtitle" | translate }}

- +
-

Hosting a conference or meeting?

-

- Use the OSF for Meetings service to provide a central location for - conference submissions -

+

{{ "home.loggedIn.hosting.title" | translate }}

+

{{ "home.loggedIn.hosting.subtitle" | translate }}

- +
diff --git a/src/app/features/home/home.component.ts b/src/app/features/home/home.component.ts index f3f8e517b..6f7692d4a 100644 --- a/src/app/features/home/home.component.ts +++ b/src/app/features/home/home.component.ts @@ -30,11 +30,18 @@ import { MyProjectsItem } from '@osf/features/my-projects/entities/my-projects.e import { GetUserInstitutions } from '@osf/features/institutions/store'; import { DialogService } from 'primeng/dynamicdialog'; import { AddProjectFormComponent } from '@shared/components/add-project-form/add-project-form.component'; +import { TranslatePipe, TranslateService } from '@ngx-translate/core'; @Component({ selector: 'osf-home', standalone: true, - imports: [RouterLink, Button, SubHeaderComponent, MyProjectsTableComponent], + imports: [ + RouterLink, + Button, + SubHeaderComponent, + MyProjectsTableComponent, + TranslatePipe, + ], templateUrl: './home.component.html', styleUrl: './home.component.scss', providers: [DialogService], @@ -44,6 +51,7 @@ export class HomeComponent implements OnInit { readonly #store = inject(Store); readonly #router = inject(Router); readonly #route = inject(ActivatedRoute); + readonly #translateService = inject(TranslateService); readonly #dialogService = inject(DialogService); readonly #isXSmall$ = inject(IS_XSMALL); readonly #isMedium$ = inject(IS_MEDIUM); @@ -231,7 +239,7 @@ export class HomeComponent implements OnInit { const dialogRef = this.#dialogService.open(AddProjectFormComponent, { width: dialogWidth, focusOnShow: false, - header: 'Create Project', + header: this.#translateService.instant('myProjects.header.createProject'), closeOnEscape: true, modal: true, closable: true, diff --git a/src/app/features/home/logged-out/data.ts b/src/app/features/home/logged-out/data.ts index b7a92ed6c..ba9e93d3c 100644 --- a/src/app/features/home/logged-out/data.ts +++ b/src/app/features/home/logged-out/data.ts @@ -1,33 +1,30 @@ export const slides = [ { img: 'assets/images/carousel1.png', - name: '2-st slide', - title: - 'OSF is a game changer for those wanting to effectively share their research process in the spirit of collaboration.', + name: 'Patricia Ayala', + title: 'home.loggedOut.testimonials.slides.patricia.quote', author: 'Patricia Ayala', - facility: 'Research Services Librarian | University of Toronto', + facility: 'home.logged-out.testimonials.slides.patricia.facility', }, { img: 'assets/images/carousel2.png', - name: '1-st slide', - title: - 'OSF is indispensable in helping me create reproducible research pipelines from preregistration through data collection and analysis. Its versatility makes it my one-stop shop for projects. The Dropbox integration effortlessly transforms my existing local workflow to public repository.', + name: 'Maya Mathur', + title: 'home.loggedOut.testimonials.slides.maya.quote', author: 'Maya Mathur', - facility: 'Department of Epidemiology Harvard University', + facility: 'home.logged-out.testimonials.slides.maya.facility', }, { img: 'assets/images/carousel3.png', - name: '1-st slide', - title: - 'Because SocArXiv is a not-for-profit organization, researchers can be assured that they are sharing their research in an environment where access, inclusivity, and preservation, rather than profit, will remain at the heart of the mission. A great benefit of partnering with OSF is that this application is a free public good.', + name: 'Philip Cohen', + title: 'home.loggedOut.testimonials.slides.philip.quote', author: 'Philip Cohen', - facility: 'SocArXiv papers', + facility: 'home.logged-out.testimonials.slides.philip.facility', }, ]; export const integrationIcons = [ { - title: 'Authentication', + title: 'home.loggedOut.integrations.categories.authentication', first: { path: 'assets/icons/socials/integrations/incommon.png', height: '36', @@ -40,7 +37,7 @@ export const integrationIcons = [ }, }, { - title: 'Discovery', + title: 'home.loggedOut.integrations.categories.discovery', first: { path: 'assets/icons/socials/integrations/google-scholar.png', height: '36', @@ -53,7 +50,7 @@ export const integrationIcons = [ }, }, { - title: 'References', + title: 'home.loggedOut.integrations.categories.references', first: { path: 'assets/icons/socials/integrations/mendeley.png', height: '42', @@ -66,7 +63,7 @@ export const integrationIcons = [ }, }, { - title: 'Storage', + title: 'home.loggedOut.integrations.categories.storage', first: { path: 'assets/icons/socials/integrations/dropbox.png', height: '34', diff --git a/src/app/features/home/logged-out/home-logged-out.component.html b/src/app/features/home/logged-out/home-logged-out.component.html index d2ca38df9..77d29c903 100644 --- a/src/app/features/home/logged-out/home-logged-out.component.html +++ b/src/app/features/home/logged-out/home-logged-out.component.html @@ -6,14 +6,11 @@ >
-

There’s a better way to manage your research

-

- OSF is a free, open platform to support your research and enable - collaboration -

+

+

-

Discover Public Research

-

- Discover projects, data, materials, and collaborators on OSF that might - be helpful to your own research -

+

+

{{ "home.loggedOut.discover.subtitle" | translate }}

@@ -51,30 +45,32 @@

-

How OSF Supports your research

+

search icon search icon
-

Search And Discover

+

+ {{ "home.loggedOut.support.sections.search.title" | translate }} +

- Find papers, data, and materials to inspire your next research - project. Search public projects to build on the work of others and - find new collaborators + {{ + "home.loggedOut.support.sections.search.description" | translate + }}

@@ -82,24 +78,26 @@

search icon search icon
-

Design Your Study

+

+ {{ "home.loggedOut.support.sections.design.title" | translate }} +

- Start a project and add collaborators, giving them access to - protocols and other research materials. Built-in version control - tracks the evolution of your study + {{ + "home.loggedOut.support.sections.design.description" | translate + }}

@@ -107,24 +105,27 @@

search icon search icon
-

Collect and Analyze Data

+

+ {{ "home.loggedOut.support.sections.collect.title" | translate }} +

- Store data, code, and other materials in OSF Storage, or connect - your Dropbox or other third-party account. Every file gets a - unique, persistent URL for citing and sharing + {{ + "home.loggedOut.support.sections.collect.description" + | translate + }}

@@ -132,18 +133,21 @@

search icon
-

Publish Your Reports

+

+ {{ "home.loggedOut.support.sections.publish.title" | translate }} +

- Share papers in OSF Preprints or a community-based preprint - provider, so others can find and cite your work. Track impact with - metrics like downloads and view counts + {{ + "home.loggedOut.support.sections.publish.description" + | translate + }}

@@ -160,12 +164,15 @@

- +
-

What others are saying

+

@@ -179,19 +186,13 @@

What others are saying

- search icon +
-

{{ slide.title }}

+

{{ slide.title | translate }}

{{ slide.author }}

-

{{ slide.facility }}

+

{{ slide.facility | translate }}

@@ -200,24 +201,38 @@

{{ slide.facility }}

-

- OSF integrations make your workflow more efficient -

+

@if (isMedium() || isWeb()) {
-

Authentication

+

+ {{ + "home.loggedOut.integrations.categories.authentication" + | translate + }} +

-

Discovery

+

+ {{ "home.loggedOut.integrations.categories.discovery" | translate }} +

-

References

+

+ {{ + "home.loggedOut.integrations.categories.references" | translate + }} +

-

Storage

+

+ {{ "home.loggedOut.integrations.categories.storage" | translate }} +

@@ -270,7 +285,7 @@

Storage

gropbox @@ -286,7 +301,11 @@

Storage

} @else if (isSmall()) {
-

Authentication

+

+ {{ + "home.loggedOut.integrations.categories.authentication" | translate + }} +

incommonAuthentication
-

Discovery

+

+ {{ "home.loggedOut.integrations.categories.discovery" | translate }} +

google-scholarDiscovery
-

References

+

+ {{ "home.loggedOut.integrations.categories.references" | translate }} +

mendeleyReferences
-

Storage

+

+ {{ "home.loggedOut.integrations.categories.storage" | translate }} +

gropbox @@ -360,7 +385,7 @@

Storage

>
-

{{ icon.title }}

+

{{ icon.title | translate }}

@@ -15,10 +15,18 @@ > @if (!isMobile()) { - My Projects - My Registrations - My Preprints - Bookmarks + {{ + "myProjects.tabs.myProjects" | translate + }} + {{ + "myProjects.tabs.myRegistrations" | translate + }} + {{ + "myProjects.tabs.myPreprints" | translate + }} + {{ + "myProjects.tabs.bookmarks" | translate + }} } @@ -32,7 +40,14 @@ optionValue="value" [ngModel]="selectedTab()" (ngModelChange)="selectedTab.set($event)" - > + > + + {{ selectedOption.label | translate }} + + + {{ item.label | translate }} + + } @@ -85,10 +100,7 @@ @if (!bookmarks().length && !isLoading()) { -

- You don't have any bookmarks. Click the bookmark icon on projects - or registrations to add them here. -

+

{{ "myProjects.bookmarks.emptyState" | translate }}

} @else { (); protected readonly defaultTabValue = 0; @@ -75,10 +78,22 @@ export class MyProjectsComponent implements OnInit { protected readonly isTablet = toSignal(inject(IS_MEDIUM)); protected readonly isMobile = toSignal(inject(IS_XSMALL)); protected readonly tabOptions: TabOption[] = [ - { label: 'My Projects', value: 0 }, - { label: 'My Registrations', value: 1 }, - { label: 'My Preprints', value: 2 }, - { label: 'Bookmarks', value: 3 }, + { + label: 'myProjects.tabs.myProjects', + value: 0, + }, + { + label: 'myProjects.tabs.myRegistrations', + value: 1, + }, + { + label: 'myProjects.tabs.myPreprints', + value: 2, + }, + { + label: 'myProjects.tabs.bookmarks', + value: 3, + }, ]; protected readonly queryParams = toSignal(this.#route.queryParams); @@ -369,7 +384,7 @@ export class MyProjectsComponent implements OnInit { this.#dialogService.open(AddProjectFormComponent, { width: dialogWidth, focusOnShow: false, - header: 'Create Project', + header: this.#translateService.instant('myProjects.header.createProject'), closeOnEscape: true, modal: true, closable: true, diff --git a/src/app/features/project/files/project-files.component.ts b/src/app/features/project/files/project-files.component.ts index 947dd6897..abc78f6d0 100644 --- a/src/app/features/project/files/project-files.component.ts +++ b/src/app/features/project/files/project-files.component.ts @@ -5,31 +5,31 @@ import { inject, signal, } from '@angular/core'; -import { SubHeaderComponent } from '@shared/components/sub-header/sub-header.component'; import { TableModule } from 'primeng/table'; import { FileItem, FILES, } from '@osf/features/project/files/project-files.entities'; import { Router } from '@angular/router'; +import { DropdownModule } from 'primeng/dropdown'; +import { DatePipe } from '@angular/common'; +import { Button } from 'primeng/button'; import { Select } from 'primeng/select'; import { FloatLabel } from 'primeng/floatlabel'; +import { SubHeaderComponent } from '@shared/components/sub-header/sub-header.component'; import { SearchInputComponent } from '@shared/components/search-input/search-input.component'; -import { DropdownModule } from 'primeng/dropdown'; -import { Button } from 'primeng/button'; -import { DatePipe } from '@angular/common'; @Component({ selector: 'osf-project-files', imports: [ - SubHeaderComponent, TableModule, - Select, - FloatLabel, - SearchInputComponent, DropdownModule, Button, DatePipe, + Select, + FloatLabel, + SubHeaderComponent, + SearchInputComponent, ], templateUrl: './project-files.component.html', styleUrl: './project-files.component.scss', diff --git a/src/app/features/settings/addons/addon-card/addon-card.component.html b/src/app/features/settings/addons/addon-card/addon-card.component.html index db06d1c1b..8a19c2623 100644 --- a/src/app/features/settings/addons/addon-card/addon-card.component.html +++ b/src/app/features/settings/addons/addon-card/addon-card.component.html @@ -19,7 +19,7 @@

{{ card()?.displayName }}

> @if (showDangerButton()) { {{ card()?.displayName }} } {{ card()?.displayName }} >
- Disable Account + + {{ "settings.addons.messages.deleteConfirmation.title" | translate }} +

- Are you sure you want to disable this account? All projects connected to - this account will be affected. + {{ "settings.addons.messages.deleteConfirmation.message" | translate }}

+
@if (!isMobile()) { - All Add-ons - Connected Add-ons + + {{ "settings.addons.tabs.allAddons" | translate }} + + + {{ "settings.addons.tabs.connectedAddons" | translate }} + } @@ -13,35 +21,46 @@ + > + + {{ selectedOption.label | translate }} + + + {{ item.label | translate }} + + }

- Sync your projects with external services to help stay connected and - organized. Select a category and browse the options. + {{ "settings.addons.description" | translate }}

+ > + + {{ selectedOption.label | translate }} + + + {{ item.label | translate }} + +
@@ -56,12 +75,14 @@ class="flex-1" [searchValue]="searchValue()" (searchValueChange)="searchValue.set($event || '')" - placeholder="Search add-ons" + [placeholder]="'settings.addons.filters.search' | translate" /> diff --git a/src/app/features/settings/addons/addons.component.ts b/src/app/features/settings/addons/addons.component.ts index e830e9d45..fec592769 100644 --- a/src/app/features/settings/addons/addons.component.ts +++ b/src/app/features/settings/addons/addons.component.ts @@ -16,6 +16,7 @@ import { IS_XSMALL } from '@shared/utils/breakpoints.tokens'; import { SelectModule } from 'primeng/select'; import { FormsModule } from '@angular/forms'; import { Store } from '@ngxs/store'; +import { TranslatePipe } from '@ngx-translate/core'; import { GetStorageAddons, GetCitationAddons, @@ -42,6 +43,7 @@ import { UserSelectors } from '@core/store/user/user.selectors'; AddonCardListComponent, SelectModule, FormsModule, + TranslatePipe, ], templateUrl: './addons.component.html', styleUrl: './addons.component.scss', @@ -110,12 +112,25 @@ export class AddonsComponent { }); protected readonly tabOptions: SelectOption[] = [ - { label: 'All Add-ons', value: 0 }, - { label: 'Connected Add-ons', value: 1 }, + { + label: 'settings.addons.tabs.allAddons', + value: 0, + }, + { + label: 'settings.addons.tabs.connectedAddons', + value: 1, + }, ]; + protected readonly categoryOptions: SelectOption[] = [ - { label: 'Additional Storage', value: 'external-storage-services' }, - { label: 'Citation Manager', value: 'external-citation-services' }, + { + label: 'settings.addons.categories.additionalService', + value: 'external-storage-services', + }, + { + label: 'settings.addons.categories.citationManager', + value: 'external-citation-services', + }, ]; protected onCategoryChange(value: string): void { diff --git a/src/app/features/settings/addons/connect-addon/connect-addon.component.html b/src/app/features/settings/addons/connect-addon/connect-addon.component.html index f5c26bb43..88eed5dd6 100644 --- a/src/app/features/settings/addons/connect-addon/connect-addon.component.html +++ b/src/app/features/settings/addons/connect-addon/connect-addon.component.html @@ -1,17 +1,31 @@ - +
-

{{ addon()?.providerName }} Terms

+

+ {{ addon()?.providerName }} + {{ "settings.addons.connectAddon.terms" | translate }} +

- Function - Status + + {{ + "settings.addons.connectAddon.table.function" | translate + }} + + + {{ + "settings.addons.connectAddon.table.status" | translate + }} + @@ -30,28 +44,27 @@

{{ addon()?.providerName }} Terms

- • This add-on connects your OSF project to an external service. - Use of this service is bound by its terms and conditions. The - OSF is not responsible for the service or for your use thereof. + {{ + "settings.addons.connectAddon.termsDescription" | translate + }}

- • This add-on allows you to store files using an external - service. Files added to this add-on are not stored within the - OSF. + {{ + "settings.addons.connectAddon.storageDescription" | translate + }}

-
+
@@ -67,25 +80,38 @@

{{ addon()?.providerName }} Terms

class="flex flex-column gap-5" >

- {{ isAuthorized() ? "Reconnect Account" : "Setup new account" }} + {{ + isAuthorized() + ? ("settings.addons.connectAddon.reconnectAccount" + | translate) + : ("settings.addons.connectAddon.setupNewAccount" | translate) + }}

@if ( addon()?.credentialsFormat === credentialsFormat.ACCESS_SECRET_KEYS ) { -

Access Key

+

+ {{ "settings.addons.form.fields.accessKey" | translate }} +

-

Secret Key

+

+ {{ "settings.addons.form.fields.secretKey" | translate }} +

} @@ -94,20 +120,32 @@

Secret Key

addon()?.credentialsFormat === credentialsFormat.DATAVERSE_API_TOKEN ) { -

Host Url

+

+ {{ "settings.addons.form.fields.hostUrl" | translate }} +

- Please include the protocol (http:// or https://) in the URL. + {{ + "settings.addons.form.fields.hostUrlDescription" | translate + }}

-

Personal Access Token

+

+ {{ + "settings.addons.form.fields.personalAccessToken" + | translate + }} +

} @@ -116,24 +154,39 @@

Personal Access Token

addon()?.credentialsFormat === credentialsFormat.USERNAME_PASSWORD ) { -

Host Url

+

+ {{ "settings.addons.form.fields.hostUrl" | translate }} +

- Please include the protocol (http:// or https://) in the URL. + {{ + "settings.addons.form.fields.hostUrlDescription" | translate + }}

-

Username

+

+ {{ "settings.addons.form.fields.username" | translate }} +

-

Password

-

These credentials will be encrypted

+

+ {{ "settings.addons.form.fields.password" | translate }} +

+

+ {{ + "settings.addons.form.fields.passwordDescription" + | translate + }} +

Password @if ( addon()?.credentialsFormat === credentialsFormat.REPO_TOKEN ) { -

Access Key

+

+ {{ "settings.addons.form.fields.accessKey" | translate }} +

-

Secret Key

+

+ {{ "settings.addons.form.fields.secretKey" | translate }} +

} -

Account Name

+

+ {{ "settings.addons.form.fields.accountName" | translate }} +

- This will distinguish your account from other using the same - addon. + {{ + "settings.addons.form.fields.accountNameDescription" + | translate + }}

@@ -173,7 +238,7 @@

Account Name

@if (!isAuthorized()) { Account Name Account Name > } @else { Account Name Account Name
-

Setup new account

+

+ {{ "settings.addons.connectAddon.setupNewAccount" | translate }} +

Setup new account

- Complete the OAuth process in the new window before returning to - this page. If you do not see a new window, please click the Start - Oauth link below. + {{ "settings.addons.connectAddon.oauthDescription" | translate }}

- Start OAuth + {{ "settings.addons.connectAddon.startOauth" | translate }} +
diff --git a/src/app/features/settings/addons/connect-addon/connect-addon.component.ts b/src/app/features/settings/addons/connect-addon/connect-addon.component.ts index 993b1370c..502301dc4 100644 --- a/src/app/features/settings/addons/connect-addon/connect-addon.component.ts +++ b/src/app/features/settings/addons/connect-addon/connect-addon.component.ts @@ -13,6 +13,7 @@ import { TableModule } from 'primeng/table'; import { RouterLink, Router } from '@angular/router'; import { NgClass } from '@angular/common'; import { Card } from 'primeng/card'; +import { TranslatePipe } from '@ngx-translate/core'; import { FormsModule, FormBuilder, @@ -57,10 +58,10 @@ import { AddonTerm } from '@osf/features/settings/addons/entities/addon-terms.in ReactiveFormsModule, InputText, Password, + TranslatePipe, ], templateUrl: './connect-addon.component.html', styleUrl: './connect-addon.component.scss', - standalone: true, }) export class ConnectAddonComponent { protected readonly stepper = viewChild(Stepper); diff --git a/src/app/features/settings/developer-apps/developer-app-add-edit-form/developer-app-add-edit-form.component.html b/src/app/features/settings/developer-apps/developer-app-add-edit-form/developer-app-add-edit-form.component.html index 1514fa5dd..01855c30c 100644 --- a/src/app/features/settings/developer-apps/developer-app-add-edit-form/developer-app-add-edit-form.component.html +++ b/src/app/features/settings/developer-apps/developer-app-add-edit-form/developer-app-add-edit-form.component.html @@ -4,7 +4,9 @@ class="flex flex-column gap-3" >
- +
- +
- +
- + } @else { diff --git a/src/app/features/settings/developer-apps/developer-app-add-edit-form/developer-app-add-edit-form.component.ts b/src/app/features/settings/developer-apps/developer-app-add-edit-form/developer-app-add-edit-form.component.ts index 85fb5054b..52c2eea7b 100644 --- a/src/app/features/settings/developer-apps/developer-app-add-edit-form/developer-app-add-edit-form.component.ts +++ b/src/app/features/settings/developer-apps/developer-app-add-edit-form/developer-app-add-edit-form.component.ts @@ -32,10 +32,11 @@ import { CreateDeveloperApp, UpdateDeveloperApp, } from '@osf/features/settings/developer-apps/store'; +import { TranslatePipe } from '@ngx-translate/core'; @Component({ selector: 'osf-developer-app-add-edit-form', - imports: [Button, InputText, ReactiveFormsModule, NgClass], + imports: [Button, InputText, ReactiveFormsModule, NgClass, TranslatePipe], templateUrl: './developer-app-add-edit-form.component.html', styleUrl: './developer-app-add-edit-form.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/src/app/features/settings/developer-apps/developer-app-details/developer-app-details.component.html b/src/app/features/settings/developer-apps/developer-app-details/developer-app-details.component.html index 2e3a12833..0eea8ad77 100644 --- a/src/app/features/settings/developer-apps/developer-app-details/developer-app-details.component.html +++ b/src/app/features/settings/developer-apps/developer-app-details/developer-app-details.component.html @@ -1,7 +1,8 @@
@@ -9,7 +10,7 @@

{{ developerApp()?.name }}

{{ developerApp()?.name }}
-

Client ID

+

+ {{ "settings.developerApps.details.clientId.title" | translate }} +

- The client ID is the developer app's unique identifier and is safe - to share publicly. + {{ + "settings.developerApps.details.clientId.description" | translate + }}

@@ -31,7 +35,7 @@

Client ID

class="copy-notification" [class.visible]="clientIdCopiedNotificationVisible()" > - Copied! + {{ "settings.developerApps.messages.copied" | translate }} @@ -48,11 +52,17 @@

Client ID

-

Client Secret

+

+ {{ + "settings.developerApps.details.clientSecret.title" | translate + }} +

- The client secret is available only to you. Keep it private and do - not share it. + {{ + "settings.developerApps.details.clientSecret.description" + | translate + }}

@@ -61,7 +71,7 @@

Client Secret

class="copy-notification" [class.visible]="clientSecretCopiedNotificationVisible()" > - Copied! + {{ "settings.developerApps.messages.copied" | translate }} Client Secret Client Secret
@@ -105,7 +120,7 @@

Client Secret

-

Edit App

+

{{ "settings.developerApps.form.editTitle" | translate }}

{ this.#store @@ -118,15 +127,18 @@ export class DeveloperAppDetailsComponent { resetClientSecret(): void { this.#confirmationService.confirm({ ...defaultConfirmationConfig, - message: - 'Resetting the client secret will render your application unusable until it is updated with the new client secret,' + - ' and all users must reauthorize access. Previously issued access tokens will no longer work.' + - '

Are you sure you want to reset the client secret? This cannot be reversed.', - header: `Reset Client Secret?`, + message: this.#translateService.instant( + 'settings.developerApps.confirmation.resetSecret.message', + ), + header: this.#translateService.instant( + 'settings.developerApps.confirmation.resetSecret.title', + ), acceptButtonProps: { ...defaultConfirmationConfig.acceptButtonProps, severity: 'danger', - label: 'Reset', + label: this.#translateService.instant( + 'settings.developerApps.details.clientSecret.reset', + ), }, accept: () => { this.#store.dispatch(new ResetClientSecret(this.clientId())); diff --git a/src/app/features/settings/developer-apps/developer-apps-container.component.html b/src/app/features/settings/developer-apps/developer-apps-container.component.html index c5292d04b..ce1c1498a 100644 --- a/src/app/features/settings/developer-apps/developer-apps-container.component.html +++ b/src/app/features/settings/developer-apps/developer-apps-container.component.html @@ -1,7 +1,7 @@ diff --git a/src/app/features/settings/developer-apps/developer-apps-container.component.ts b/src/app/features/settings/developer-apps/developer-apps-container.component.ts index 862a717f9..d4d6d5968 100644 --- a/src/app/features/settings/developer-apps/developer-apps-container.component.ts +++ b/src/app/features/settings/developer-apps/developer-apps-container.component.ts @@ -6,10 +6,11 @@ import { IS_MEDIUM, IS_XSMALL } from '@shared/utils/breakpoints.tokens'; import { toSignal } from '@angular/core/rxjs-interop'; import { map } from 'rxjs'; import { DeveloperAppAddEditFormComponent } from '@osf/features/settings/developer-apps/developer-app-add-edit-form/developer-app-add-edit-form.component'; +import { TranslateModule, TranslateService } from '@ngx-translate/core'; @Component({ selector: 'osf-developer-apps', - imports: [RouterOutlet, SubHeaderComponent], + imports: [RouterOutlet, SubHeaderComponent, TranslateModule], templateUrl: './developer-apps-container.component.html', styleUrl: './developer-apps-container.component.scss', providers: [DialogService], @@ -20,6 +21,7 @@ export class DeveloperAppsContainerComponent { #router = inject(Router); #isXSmall = toSignal(inject(IS_XSMALL)); #isMedium = toSignal(inject(IS_MEDIUM)); + #translateService = inject(TranslateService); protected readonly isBaseRoute = toSignal( this.#router.events.pipe( @@ -39,7 +41,9 @@ export class DeveloperAppsContainerComponent { this.#dialogService.open(DeveloperAppAddEditFormComponent, { width: dialogWidth, focusOnShow: false, - header: 'Create Developer App', + header: this.#translateService.instant( + 'settings.developerApps.form.createTitle', + ), closeOnEscape: true, modal: true, closable: true, diff --git a/src/app/features/settings/developer-apps/developer-apps-list/developer-apps-list.component.html b/src/app/features/settings/developer-apps/developer-apps-list/developer-apps-list.component.html index 7aa2d0381..2cf779ada 100644 --- a/src/app/features/settings/developer-apps/developer-apps-list/developer-apps-list.component.html +++ b/src/app/features/settings/developer-apps/developer-apps-list/developer-apps-list.component.html @@ -1,7 +1,6 @@

- Third-party web applications can connect to the OSF on behalf of users via - the OAuth 2.0 web application flow. + {{ "settings.developerApps.list.description" | translate }}

@@ -14,7 +13,7 @@

{{ developerApp.name }}

diff --git a/src/app/features/settings/developer-apps/developer-apps-list/developer-apps-list.component.ts b/src/app/features/settings/developer-apps/developer-apps-list/developer-apps-list.component.ts index 21b8bbc12..29997c6ed 100644 --- a/src/app/features/settings/developer-apps/developer-apps-list/developer-apps-list.component.ts +++ b/src/app/features/settings/developer-apps/developer-apps-list/developer-apps-list.component.ts @@ -20,10 +20,11 @@ import { } from '@osf/features/settings/developer-apps/store'; import { DeveloperApp } from '@osf/features/settings/developer-apps/entities/developer-apps.models'; import { Skeleton } from 'primeng/skeleton'; +import { TranslateModule, TranslateService } from '@ngx-translate/core'; @Component({ selector: 'osf-developer-applications-list', - imports: [Button, Card, RouterLink, Skeleton], + imports: [Button, Card, RouterLink, Skeleton, TranslateModule], templateUrl: './developer-apps-list.component.html', styleUrl: './developer-apps-list.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, @@ -31,6 +32,7 @@ import { Skeleton } from 'primeng/skeleton'; export class DeveloperAppsListComponent implements OnInit { #store = inject(Store); #confirmationService = inject(ConfirmationService); + #translateService = inject(TranslateService); protected readonly isLoading = signal(false); protected readonly isXSmall = toSignal(inject(IS_XSMALL)); @@ -41,13 +43,19 @@ export class DeveloperAppsListComponent implements OnInit { deleteApp(developerApp: DeveloperApp): void { this.#confirmationService.confirm({ ...defaultConfirmationConfig, - message: - "Are you sure you want to delete this developer app? All users' access tokens will be revoked. This cannot be reversed.", - header: `Delete App ${developerApp.name}?`, + message: this.#translateService.instant( + 'settings.developerApps.confirmation.delete.message', + ), + header: this.#translateService.instant( + 'settings.developerApps.confirmation.delete.title', + { name: developerApp.name }, + ), acceptButtonProps: { ...defaultConfirmationConfig.acceptButtonProps, severity: 'danger', - label: 'Delete', + label: this.#translateService.instant( + 'settings.developerApps.list.deleteButton', + ), }, accept: () => { this.#store.dispatch(new DeleteDeveloperApp(developerApp.clientId)); diff --git a/src/app/features/settings/notifications/notifications.component.html b/src/app/features/settings/notifications/notifications.component.html index 5210f9da8..8fc3bc434 100644 --- a/src/app/features/settings/notifications/notifications.component.html +++ b/src/app/features/settings/notifications/notifications.component.html @@ -1,12 +1,12 @@
-

Configure Email Preferences

+

{{ "settings.notifications.emailPreferences.title" | translate }}

@@ -14,11 +14,17 @@

Configure Email Preferences

- Receive general notifications about the OSF every 2-3 weeks. + {{ + "settings.notifications.emailPreferences.items.general.description" + | translate + }}
@@ -28,48 +34,82 @@

Configure Email Preferences

- Receive helpful tips on how to make the most of the OSF, up to once - per week. + {{ + "settings.notifications.emailPreferences.items.help.description" + | translate + }}
- + +
-

Configure Notification Preferences

+

+ {{ "settings.notifications.notificationPreferences.title" | translate }} +

- Note: Transactional and administrative service emails will still be sent. + {{ "settings.notifications.notificationPreferences.note" | translate }}
-
Replies to your comments
- +
+ {{ + "settings.notifications.notificationPreferences.items.replies" + | translate + }} +
-
Comments added
- +
+ {{ + "settings.notifications.notificationPreferences.items.comments" + | translate + }} +
-
Files updated
- +
+ {{ + "settings.notifications.notificationPreferences.items.files" + | translate + }} +
-
Mentions added
- +
+ {{ + "settings.notifications.notificationPreferences.items.mentions" + | translate + }} +
-
Preprint submissions updated
- +
+ {{ + "settings.notifications.notificationPreferences.items.preprints" + | translate + }} +
diff --git a/src/app/features/settings/notifications/notifications.component.ts b/src/app/features/settings/notifications/notifications.component.ts index 675471cc4..8cb36f16b 100644 --- a/src/app/features/settings/notifications/notifications.component.ts +++ b/src/app/features/settings/notifications/notifications.component.ts @@ -3,10 +3,18 @@ import { SubHeaderComponent } from '@shared/components/sub-header/sub-header.com import { Checkbox } from 'primeng/checkbox'; import { Button } from 'primeng/button'; import { DropdownModule } from 'primeng/dropdown'; +import { TranslatePipe } from '@ngx-translate/core'; @Component({ selector: 'osf-notifications', - imports: [SubHeaderComponent, Checkbox, Button, DropdownModule], + standalone: true, + imports: [ + SubHeaderComponent, + Checkbox, + Button, + DropdownModule, + TranslatePipe, + ], templateUrl: './notifications.component.html', styleUrl: './notifications.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/src/app/features/settings/profile-settings/education/education.component.html b/src/app/features/settings/profile-settings/education/education.component.html index 5c9e60ada..65d515ba6 100644 --- a/src/app/features/settings/profile-settings/education/education.component.html +++ b/src/app/features/settings/profile-settings/education/education.component.html @@ -12,11 +12,16 @@ class="flex flex-column border-1 border-round-lg p-4 name-container row-gap-4" >
-

Education {{ index + 1 }}

+

+ {{ + "settings.profileSettings.education.title" + | translate: { index: index + 1 } + }} +

@if (index !== 0) {
- Remove + + {{ "settings.profileSettings.education.remove" | translate }}
} @@ -24,9 +29,11 @@

Education {{ index + 1 }}

- + Education {{ index + 1 }} class="flex w-full column-gap-3 row-gap-4 flex-wrap lg:flex-nowrap" >
- + Education {{ index + 1 }} />
- + Education {{ index + 1 }} class="w-full md:w-6 flex column-gap-3 row-gap-4 flex-wrap lg:flex-nowrap" >
- + Education {{ index + 1 }} >
- + Education {{ index + 1 }} + {{ "settings.profileSettings.education.ongoing" | translate }} +
@@ -116,7 +132,7 @@

Education {{ index + 1 }}

Education {{ index + 1 }} >
- +
diff --git a/src/app/features/settings/profile-settings/education/education.component.ts b/src/app/features/settings/profile-settings/education/education.component.ts index 0ea8e8d63..16ef24056 100644 --- a/src/app/features/settings/profile-settings/education/education.component.ts +++ b/src/app/features/settings/profile-settings/education/education.component.ts @@ -17,10 +17,18 @@ import { import { Store } from '@ngxs/store'; import { UpdateProfileSettingsEducation } from '@osf/features/settings/profile-settings/profile-settings.actions'; import { ProfileSettingsSelectors } from '@osf/features/settings/profile-settings/profile-settings.selectors'; +import { TranslatePipe } from '@ngx-translate/core'; @Component({ selector: 'osf-education', - imports: [ReactiveFormsModule, Button, InputText, DatePicker, Checkbox], + imports: [ + ReactiveFormsModule, + Button, + InputText, + DatePicker, + Checkbox, + TranslatePipe, + ], templateUrl: './education.component.html', styleUrl: './education.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/src/app/features/settings/profile-settings/employment/employment.component.html b/src/app/features/settings/profile-settings/employment/employment.component.html index 7d8708600..5849eda60 100644 --- a/src/app/features/settings/profile-settings/employment/employment.component.html +++ b/src/app/features/settings/profile-settings/employment/employment.component.html @@ -13,11 +13,16 @@ class="flex flex-column border-1 border-round-lg p-4 name-container row-gap-4" >
-

Position {{ index + 1 }}

+

+ {{ + "settings.profileSettings.employment.title" + | translate: { index: index + 1 } + }} +

@if (index !== 0) {
- Remove + + {{ "settings.profileSettings.employment.remove" | translate }}
} @@ -25,7 +30,9 @@

Position {{ index + 1 }}

- + Position {{ index + 1 }} class="flex w-full column-gap-3 row-gap-4 flex-wrap lg:flex-nowrap" >
- + Position {{ index + 1 }} />
- + Position {{ index + 1 }} class="w-full md:w-6 flex column-gap-3 row-gap-4 flex-wrap lg:flex-nowrap" >
- + Position {{ index + 1 }} >
- + Position {{ index + 1 }} + {{ + "settings.profileSettings.employment.presentlyEmployed" + | translate + }} +
@@ -117,7 +138,7 @@

Position {{ index + 1 }}

Position {{ index + 1 }} >
- +
diff --git a/src/app/features/settings/profile-settings/employment/employment.component.ts b/src/app/features/settings/profile-settings/employment/employment.component.ts index 81f8df67e..84a3cbe86 100644 --- a/src/app/features/settings/profile-settings/employment/employment.component.ts +++ b/src/app/features/settings/profile-settings/employment/employment.component.ts @@ -22,10 +22,18 @@ import { EmploymentForm, } from '@osf/features/settings/profile-settings/employment/employment.entities'; import { UpdateProfileSettingsEmployment } from '@osf/features/settings/profile-settings/profile-settings.actions'; +import { TranslatePipe } from '@ngx-translate/core'; @Component({ selector: 'osf-employment', - imports: [Button, Checkbox, DatePicker, InputText, ReactiveFormsModule], + imports: [ + Button, + Checkbox, + DatePicker, + InputText, + ReactiveFormsModule, + TranslatePipe, + ], templateUrl: './employment.component.html', styleUrl: './employment.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/src/app/features/settings/profile-settings/name/name.component.html b/src/app/features/settings/profile-settings/name/name.component.html index 3e8b73285..9bb548d04 100644 --- a/src/app/features/settings/profile-settings/name/name.component.html +++ b/src/app/features/settings/profile-settings/name/name.component.html @@ -1,9 +1,6 @@

- Your full name is the name that will be displayed in your profile. To - control the way your name will appear in citations, you can use the - "Auto-fill" button to automatically infer your first name, last name, etc., - or edit the fields directly below. + {{ "settings.profileSettings.name.description" | translate }}

>
- +
@@ -31,9 +31,9 @@

class="flex flex-column row-gap-2 xl:flex-row xl:align-items-end xl:column-gap-3" >
- +
class="flex flex-column row-gap-2 xl:flex-row xl:align-items-end xl:column-gap-3" >
- + />
- +
-

Citation Preview

+

+ {{ "settings.profileSettings.name.citationPreview.title" | translate }} +

-

Style:

-

Citation format:

+

+ {{ + "settings.profileSettings.name.citationPreview.style" | translate + }} +

+

+ {{ + "settings.profileSettings.name.citationPreview.citationFormat" + | translate + }} +

APA

@@ -102,8 +113,17 @@

Doe, J. T.

-

Style:

-

Citation format:

+

+ {{ + "settings.profileSettings.name.citationPreview.style" | translate + }} +

+

+ {{ + "settings.profileSettings.name.citationPreview.citationFormat" + | translate + }} +

MLA

@@ -120,10 +140,13 @@

Doe, John T.

- +
diff --git a/src/app/features/settings/profile-settings/name/name.component.ts b/src/app/features/settings/profile-settings/name/name.component.ts index f43dded86..03d973de7 100644 --- a/src/app/features/settings/profile-settings/name/name.component.ts +++ b/src/app/features/settings/profile-settings/name/name.component.ts @@ -12,10 +12,11 @@ import { Store } from '@ngxs/store'; import { ProfileSettingsSelectors } from '@osf/features/settings/profile-settings/profile-settings.selectors'; import { NameForm } from '@osf/features/settings/profile-settings/name/name.entities'; import { UpdateProfileSettingsUser } from '@osf/features/settings/profile-settings/profile-settings.actions'; +import { TranslatePipe } from '@ngx-translate/core'; @Component({ selector: 'osf-name', - imports: [Button, InputText, ReactiveFormsModule], + imports: [Button, InputText, ReactiveFormsModule, TranslatePipe], templateUrl: './name.component.html', styleUrl: './name.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/src/app/features/settings/profile-settings/profile-settings.component.html b/src/app/features/settings/profile-settings/profile-settings.component.html index fb525b6c2..d06e33503 100644 --- a/src/app/features/settings/profile-settings/profile-settings.component.html +++ b/src/app/features/settings/profile-settings/profile-settings.component.html @@ -1,6 +1,6 @@ @@ -12,10 +12,18 @@ > @if (!isMobile()) { - Name - Social - Employment - Education + {{ + "settings.profileSettings.tabs.name" | translate + }} + {{ + "settings.profileSettings.tabs.social" | translate + }} + {{ + "settings.profileSettings.tabs.employment" | translate + }} + {{ + "settings.profileSettings.tabs.education" | translate + }} } diff --git a/src/app/features/settings/profile-settings/profile-settings.component.ts b/src/app/features/settings/profile-settings/profile-settings.component.ts index f221892cf..7df259491 100644 --- a/src/app/features/settings/profile-settings/profile-settings.component.ts +++ b/src/app/features/settings/profile-settings/profile-settings.component.ts @@ -11,6 +11,7 @@ import { EducationComponent } from '@osf/features/settings/profile-settings/educ import { EmploymentComponent } from '@osf/features/settings/profile-settings/employment/employment.component'; import { NameComponent } from '@osf/features/settings/profile-settings/name/name.component'; import { SocialComponent } from '@osf/features/settings/profile-settings/social/social.component'; +import { TranslatePipe } from '@ngx-translate/core'; @Component({ selector: 'osf-profile-settings', @@ -29,6 +30,7 @@ import { SocialComponent } from '@osf/features/settings/profile-settings/social/ EmploymentComponent, NameComponent, SocialComponent, + TranslatePipe, ], templateUrl: './profile-settings.component.html', styleUrl: './profile-settings.component.scss', diff --git a/src/app/features/settings/profile-settings/social/social.component.html b/src/app/features/settings/profile-settings/social/social.component.html index f29a796f0..13dde1c38 100644 --- a/src/app/features/settings/profile-settings/social/social.component.html +++ b/src/app/features/settings/profile-settings/social/social.component.html @@ -7,11 +7,16 @@ class="flex flex-column border-1 border-round-lg p-3 sm:p-5 name-container row-gap-4" >
-

Social Link {{ index + 1 }}

+

+ {{ + "settings.profileSettings.social.title" + | translate: { index: index + 1 } + }} +

@if (index !== 0) {
- Remove + + {{ "settings.profileSettings.social.remove" | translate }}
} @@ -21,7 +26,9 @@

Social Link {{ index + 1 }}

class="flex flex-column row-gap-4 w-full md:flex-row md:align-items-end md:column-gap-3" >
-

Social output

+

+ {{ "settings.profileSettings.social.socialOutput" | translate }} +

Social Link {{ index + 1 }}

-

Web Address

+

+ {{ "settings.profileSettings.social.webAddress" | translate }} +

{{ getDomain(index) }} Social Link {{ index + 1 }} Social Link {{ index + 1 }} >
- +
diff --git a/src/app/features/settings/profile-settings/social/social.component.ts b/src/app/features/settings/profile-settings/social/social.component.ts index d77d11627..c407daffe 100644 --- a/src/app/features/settings/profile-settings/social/social.component.ts +++ b/src/app/features/settings/profile-settings/social/social.component.ts @@ -27,6 +27,7 @@ import { import { Store } from '@ngxs/store'; import { UpdateProfileSettingsSocialLinks } from '@osf/features/settings/profile-settings/profile-settings.actions'; import { ProfileSettingsSelectors } from '@osf/features/settings/profile-settings/profile-settings.selectors'; +import { TranslatePipe } from '@ngx-translate/core'; @Component({ selector: 'osf-social', @@ -37,6 +38,7 @@ import { ProfileSettingsSelectors } from '@osf/features/settings/profile-setting InputGroupAddon, InputText, ReactiveFormsModule, + TranslatePipe, ], templateUrl: './social.component.html', styleUrl: './social.component.scss', diff --git a/src/app/features/settings/tokens/token-add-edit-form/token-add-edit-form.component.html b/src/app/features/settings/tokens/token-add-edit-form/token-add-edit-form.component.html index 1249f93f3..a0199a5c1 100644 --- a/src/app/features/settings/tokens/token-add-edit-form/token-add-edit-form.component.html +++ b/src/app/features/settings/tokens/token-add-edit-form/token-add-edit-form.component.html @@ -4,7 +4,9 @@ class="flex flex-column gap-4" >
- +
-

Scopes

+

+ {{ "settings.tokens.form.scopes.title" | translate }} +

- Scopes limit access for personal access tokens. + {{ "settings.tokens.form.scopes.description" | translate }}

@@ -45,20 +49,20 @@

{{ scope.id }}

@if (isEditMode()) { } @else { diff --git a/src/app/features/settings/tokens/token-add-edit-form/token-add-edit-form.component.ts b/src/app/features/settings/tokens/token-add-edit-form/token-add-edit-form.component.ts index ce72b235d..82e865d56 100644 --- a/src/app/features/settings/tokens/token-add-edit-form/token-add-edit-form.component.ts +++ b/src/app/features/settings/tokens/token-add-edit-form/token-add-edit-form.component.ts @@ -33,10 +33,18 @@ import { TokensSelectors, UpdateToken, } from '@osf/features/settings/tokens/store'; +import { TranslatePipe, TranslateService } from '@ngx-translate/core'; @Component({ selector: 'osf-token-add-edit-form', - imports: [Button, InputText, ReactiveFormsModule, CommonModule, Checkbox], + imports: [ + Button, + InputText, + ReactiveFormsModule, + CommonModule, + Checkbox, + TranslatePipe, + ], templateUrl: './token-add-edit-form.component.html', styleUrl: './token-add-edit-form.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, @@ -46,6 +54,8 @@ export class TokenAddEditFormComponent implements OnInit { #route = inject(ActivatedRoute); #router = inject(Router); #dialogService = inject(DialogService); + #translateService = inject(TranslateService); + isEditMode = input(false); initialValues = input(null); protected readonly tokenId = toSignal( @@ -119,7 +129,9 @@ export class TokenAddEditFormComponent implements OnInit { this.#dialogService.open(TokenCreatedDialogComponent, { width: dialogWidth, - header: 'Token Successfully Created', + header: this.#translateService.instant( + 'settings.tokens.created-dialog.title', + ), closeOnEscape: true, modal: true, closable: true, diff --git a/src/app/features/settings/tokens/token-created-dialog/token-created-dialog.component.html b/src/app/features/settings/tokens/token-created-dialog/token-created-dialog.component.html index f00b0ea38..4f72ee7cf 100644 --- a/src/app/features/settings/tokens/token-created-dialog/token-created-dialog.component.html +++ b/src/app/features/settings/tokens/token-created-dialog/token-created-dialog.component.html @@ -1,12 +1,13 @@
+

- Token {{ tokenName() }} successfully created. -

-

- This token will never expire. This token should never be shared with - others. If it is accidentally revealed publicly, it should be deactivated - immediately. + {{ "settings.tokens.createdDialog.warningMessage" | translate }}

@@ -17,7 +18,7 @@ class="copy-notification" [class.visible]="tokenCopiedNotificationVisible()" > - Copied! + {{ "settings.tokens.createdDialog.copyNotification" | translate }} @@ -30,13 +31,13 @@
-

This is the only time your token will be displayed.

+

{{ "settings.tokens.createdDialog.tokenWarning" | translate }}

diff --git a/src/app/features/settings/tokens/token-created-dialog/token-created-dialog.component.ts b/src/app/features/settings/tokens/token-created-dialog/token-created-dialog.component.ts index 7f9e28de7..54a2fa00d 100644 --- a/src/app/features/settings/tokens/token-created-dialog/token-created-dialog.component.ts +++ b/src/app/features/settings/tokens/token-created-dialog/token-created-dialog.component.ts @@ -14,10 +14,19 @@ import { InputText } from 'primeng/inputtext'; import { IconField } from 'primeng/iconfield'; import { InputIcon } from 'primeng/inputicon'; import { ClipboardModule } from '@angular/cdk/clipboard'; +import { TranslatePipe } from '@ngx-translate/core'; @Component({ selector: 'osf-token-created-dialog', - imports: [Button, InputText, IconField, InputIcon, ClipboardModule], + standalone: true, + imports: [ + Button, + InputText, + IconField, + InputIcon, + ClipboardModule, + TranslatePipe, + ], templateUrl: './token-created-dialog.component.html', styleUrl: './token-created-dialog.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/src/app/features/settings/tokens/token-details/token-details.component.html b/src/app/features/settings/tokens/token-details/token-details.component.html index aef69f789..0053afb54 100644 --- a/src/app/features/settings/tokens/token-details/token-details.component.html +++ b/src/app/features/settings/tokens/token-details/token-details.component.html @@ -4,14 +4,15 @@ > @if (token()) {

{{ token()?.name }}

{{ token()?.name }}
-

Edit Token

+

{{ "settings.tokens.details.title" | translate }}

 } diff --git a/src/app/features/settings/tokens/token-details/token-details.component.ts b/src/app/features/settings/tokens/token-details/token-details.component.ts index 9da905733..c534e17fb 100644 --- a/src/app/features/settings/tokens/token-details/token-details.component.ts +++ b/src/app/features/settings/tokens/token-details/token-details.component.ts @@ -21,10 +21,18 @@ import { DeleteToken, GetTokenById, } from '@osf/features/settings/tokens/store/tokens.actions'; +import { TranslatePipe, TranslateService } from '@ngx-translate/core'; @Component({ selector: 'osf-token-details', - imports: [Button, Card, FormsModule, RouterLink, TokenAddEditFormComponent], + imports: [ + Button, + Card, + FormsModule, + RouterLink, + TokenAddEditFormComponent, + TranslatePipe, + ], providers: [DialogService, DynamicDialogRef], changeDetection: ChangeDetectionStrategy.OnPush, templateUrl: './token-details.component.html', @@ -36,6 +44,7 @@ export class TokenDetailsComponent { #route = inject(ActivatedRoute); #router = inject(Router); #store = inject(Store); + #translateService = inject(TranslateService); readonly tokenId = toSignal( this.#route.params.pipe( @@ -64,13 +73,19 @@ export class TokenDetailsComponent { deleteToken(): void { this.#confirmationService.confirm({ ...defaultConfirmationConfig, - message: - 'Are you sure you want to delete this token? This action cannot be reversed.', - header: `Delete Token ${this.token()?.name}?`, + message: this.#translateService.instant( + 'settings.tokens.confirmation.delete.message', + ), + header: this.#translateService.instant( + 'settings.tokens.confirmation.delete.title', + { name: this.token()?.name }, + ), acceptButtonProps: { ...defaultConfirmationConfig.acceptButtonProps, severity: 'danger', - label: 'Delete', + label: this.#translateService.instant( + 'settings.tokens.list.deleteButton', + ), }, accept: () => { this.#store.dispatch(new DeleteToken(this.tokenId())).subscribe({ diff --git a/src/app/features/settings/tokens/tokens-list/tokens-list.component.html b/src/app/features/settings/tokens/tokens-list/tokens-list.component.html index 5c43e7057..9a9259797 100644 --- a/src/app/features/settings/tokens/tokens-list/tokens-list.component.html +++ b/src/app/features/settings/tokens/tokens-list/tokens-list.component.html @@ -1,7 +1,6 @@

- Personal access tokens function like ordinary OAuth access tokens. They can - be used to authenticate to the API. + {{ "settings.tokens.list.description" | translate }}

@@ -17,7 +16,7 @@

{{ token.name }}

diff --git a/src/app/features/settings/tokens/tokens-list/tokens-list.component.ts b/src/app/features/settings/tokens/tokens-list/tokens-list.component.ts index dead9740f..954b51808 100644 --- a/src/app/features/settings/tokens/tokens-list/tokens-list.component.ts +++ b/src/app/features/settings/tokens/tokens-list/tokens-list.component.ts @@ -20,10 +20,11 @@ import { TokensSelectors, } from '@osf/features/settings/tokens/store'; import { Skeleton } from 'primeng/skeleton'; +import { TranslateModule, TranslateService } from '@ngx-translate/core'; @Component({ selector: 'osf-tokens-list', - imports: [Button, Card, RouterLink, Skeleton], + imports: [Button, Card, RouterLink, Skeleton, TranslateModule], templateUrl: './tokens-list.component.html', styleUrl: './tokens-list.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, @@ -31,22 +32,29 @@ import { Skeleton } from 'primeng/skeleton'; export class TokensListComponent implements OnInit { #store = inject(Store); #confirmationService = inject(ConfirmationService); - #isXSmall$ = inject(IS_XSMALL); + #translateService = inject(TranslateService); + protected readonly isLoading = signal(false); - protected readonly isXSmall = toSignal(this.#isXSmall$); + protected readonly isXSmall = toSignal(inject(IS_XSMALL)); tokens = this.#store.selectSignal(TokensSelectors.getTokens); deleteToken(token: Token) { this.#confirmationService.confirm({ ...defaultConfirmationConfig, - message: - 'Are you sure you want to delete this token? This action cannot be reversed.', - header: `Delete Token ${token.name}?`, + message: this.#translateService.instant( + 'settings.tokens.confirmation.delete.message', + ), + header: this.#translateService.instant( + 'settings.tokens.confirmation.delete.title', + { name: token.name }, + ), acceptButtonProps: { ...defaultConfirmationConfig.acceptButtonProps, severity: 'danger', - label: 'Delete', + label: this.#translateService.instant( + 'settings.tokens.list.deleteButton', + ), }, accept: () => { this.#store.dispatch(new DeleteToken(token.id)); diff --git a/src/app/features/settings/tokens/tokens.component.html b/src/app/features/settings/tokens/tokens.component.html index 289bf9a99..77ac84e55 100644 --- a/src/app/features/settings/tokens/tokens.component.html +++ b/src/app/features/settings/tokens/tokens.component.html @@ -1,7 +1,7 @@ diff --git a/src/app/features/settings/tokens/tokens.component.ts b/src/app/features/settings/tokens/tokens.component.ts index ea3117cb0..0593ada88 100644 --- a/src/app/features/settings/tokens/tokens.component.ts +++ b/src/app/features/settings/tokens/tokens.component.ts @@ -13,10 +13,12 @@ import { RouterOutlet, Router } from '@angular/router'; import { Store } from '@ngxs/store'; import { GetScopes } from '@osf/features/settings/tokens/store'; import { map } from 'rxjs'; +import { TranslatePipe, TranslateService } from '@ngx-translate/core'; @Component({ selector: 'osf-tokens', - imports: [SubHeaderComponent, RouterOutlet], + standalone: true, + imports: [SubHeaderComponent, RouterOutlet, TranslatePipe], templateUrl: './tokens.component.html', styleUrl: './tokens.component.scss', providers: [DialogService], @@ -28,6 +30,7 @@ export class TokensComponent implements OnInit { #isMedium$ = inject(IS_MEDIUM); #store = inject(Store); #router = inject(Router); + #translateService = inject(TranslateService); protected readonly isXSmall = toSignal(this.#isXSmall$); protected readonly isMedium = toSignal(this.#isMedium$); @@ -49,7 +52,9 @@ export class TokensComponent implements OnInit { this.#dialogService.open(TokenAddEditFormComponent, { width: dialogWidth, focusOnShow: false, - header: 'Create Personal Access Token', + header: this.#translateService.instant( + 'settings.tokens.form.createTitle', + ), closeOnEscape: true, modal: true, closable: true, diff --git a/src/app/shared/components/add-project-form/add-project-form.component.html b/src/app/shared/components/add-project-form/add-project-form.component.html index 59711c971..7e5b0423a 100644 --- a/src/app/shared/components/add-project-form/add-project-form.component.html +++ b/src/app/shared/components/add-project-form/add-project-form.component.html @@ -5,7 +5,9 @@ >
- +
- +
-

Affiliation

+

+ {{ "myProjects.createProject.affiliation.title" | translate }} +

Affiliation (click)="selectAllAffiliations()" (keydown.enter)="selectAllAffiliations()" > - Select All + {{ "myProjects.createProject.affiliation.selectAll" | translate }} Affiliation (click)="removeAllAffiliations()" (keydown.enter)="removeAllAffiliations()" > - Remove All + {{ "myProjects.createProject.affiliation.removeAll" | translate }}
@@ -74,7 +80,9 @@

Affiliation

- +