Fix/fixes

src/app/core/components/root/root.component.html

@@ -26,4 +26,4 @@
   </div>
 }
 
-<p-confirm-dialog />
+<p-confirm-dialog styleClass="w-full md:w-6 xl:w-5" />

src/app/core/constants/storage-locations.constant.ts

@@ -1,6 +1,6 @@
-import { StorageLocation } from '@osf/features/my-projects/models/storage-location.model';
+import { CustomOption } from '@osf/shared/models';
 
-export const STORAGE_LOCATIONS: StorageLocation[] = [
+export const STORAGE_LOCATIONS: CustomOption<string>[] = [
   { label: 'United States', value: 'us' },
   { label: 'Canada - Montréal', value: 'ca-1' },
   { label: 'Germany - Frankfurt', value: 'de-1' },

src/app/core/store/user/user.selectors.ts

@@ -48,4 +48,9 @@ export class UserSelectors {
   static isUserSettingsSubmitting(state: UserStateModel): boolean {
     return state.currentUserSettings.isSubmitting!;
   }
+
+  @Selector([UserState])
+  static getShareIndexing(state: UserStateModel): boolean | undefined {
+    return state.currentUser.data?.allowIndexing;
+  }
 }

src/app/features/home/components/confirm-email/confirm-email.component.ts

@@ -23,28 +23,29 @@ import { LoadingSpinnerComponent } from '@shared/components';
 export class ConfirmEmailComponent {
   readonly dialogRef = inject(DynamicDialogRef);
   readonly config = inject(DynamicDialogConfig);
-  readonly #router = inject(Router);
-  readonly #accountSettingsService = inject(AccountSettingsService);
-  readonly #destroyRef = inject(DestroyRef);
+
+  private readonly router = inject(Router);
+  private readonly accountSettingsService = inject(AccountSettingsService);
+  private readonly destroyRef = inject(DestroyRef);
 
   verifyingEmail = signal(false);
 
   closeDialog() {
-    this.#router.navigate(['/home']);
+    this.router.navigate(['/home']);
     this.dialogRef.close();
   }
 
   verifyEmail() {
     this.verifyingEmail.set(true);
-    this.#accountSettingsService
+    this.accountSettingsService
       .confirmEmail(this.config.data.userId, this.config.data.token)
       .pipe(
-        takeUntilDestroyed(this.#destroyRef),
+        takeUntilDestroyed(this.destroyRef),
         finalize(() => this.verifyingEmail.set(false))
       )
       .subscribe({
         next: () => {
-          this.#router.navigate(['/settings/account-settings']);
+          this.router.navigate(['/settings/account-settings']);
           this.dialogRef.close();
         },
         error: () => this.closeDialog(),

src/app/features/home/home.component.scss

@@ -1,4 +1,3 @@
-@use "assets/styles/variables" as var;
 @use "assets/styles/mixins" as mix;
 
 :host {
@@ -12,29 +11,29 @@
 }
 
 .quick-search-container {
-  background-color: var.$white;
+  background-color: var(--white);
 
   .text-center {
-    color: var.$dark-blue-1;
+    color: var(--dark-blue-1);
   }
 }
 
 .public-projects-container {
-  background-color: var.$gradient-1;
+  background-color: var(--gradient-1);
 
   .osf-icon-search {
-    color: var.$dark-blue-1;
+    color: var(--dark-blue-1);
     font-size: mix.rem(32px);
     margin-right: mix.rem(12px);
   }
 }
 
 .latest-research-container {
-  background-color: var.$bg-blue-3;
+  background-color: var(--bg-blue-3);
   row-gap: mix.rem(24px);
 }
 
 .hosting-container {
-  background-color: var.$bg-blue-2;
+  background-color: var(--bg-blue-2);
   row-gap: mix.rem(24px);
 }

src/app/features/my-profile/components/my-profile-filter-chips/my-profile-filter-chips.component.ts

@@ -1,4 +1,4 @@
-import { Store } from '@ngxs/store';
+import { select, Store } from '@ngxs/store';
 
 import { Chip } from 'primeng/chip';
 
@@ -28,40 +28,41 @@ import {
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MyProfileFilterChipsComponent {
-  readonly #store = inject(Store);
+  readonly store = inject(Store);
 
-  protected filters = this.#store.selectSignal(MyProfileResourceFiltersSelectors.getAllFilters);
+  protected filters = select(MyProfileResourceFiltersSelectors.getAllFilters);
 
-  readonly isMyProfilePage = this.#store.selectSignal(MyProfileSelectors.getIsMyProfile);
+  readonly isMyProfilePage = select(MyProfileSelectors.getIsMyProfile);
 
   clearFilter(filter: FilterType) {
     switch (filter) {
       case FilterType.DateCreated:
-        this.#store.dispatch(new SetDateCreated(''));
+        this.store.dispatch(new SetDateCreated(''));
         break;
       case FilterType.Funder:
-        this.#store.dispatch(new SetFunder('', ''));
+        this.store.dispatch(new SetFunder('', ''));
         break;
       case FilterType.Subject:
-        this.#store.dispatch(new SetSubject('', ''));
+        this.store.dispatch(new SetSubject('', ''));
         break;
       case FilterType.License:
-        this.#store.dispatch(new SetLicense('', ''));
+        this.store.dispatch(new SetLicense('', ''));
         break;
       case FilterType.ResourceType:
-        this.#store.dispatch(new SetResourceType('', ''));
+        this.store.dispatch(new SetResourceType('', ''));
         break;
       case FilterType.Institution:
-        this.#store.dispatch(new SetInstitution('', ''));
+        this.store.dispatch(new SetInstitution('', ''));
         break;
       case FilterType.Provider:
-        this.#store.dispatch(new SetProvider('', ''));
+        this.store.dispatch(new SetProvider('', ''));
         break;
       case FilterType.PartOfCollection:
-        this.#store.dispatch(new SetPartOfCollection('', ''));
+        this.store.dispatch(new SetPartOfCollection('', ''));
         break;
     }
-    this.#store.dispatch(GetAllOptions);
+
+    this.store.dispatch(GetAllOptions);
   }
 
   protected readonly FilterType = FilterType;

src/app/features/my-profile/components/my-profile-resource-filters/my-profile-resource-filters.component.scss

@@ -1,15 +1,13 @@
-@use "assets/styles/variables" as var;
-
 :host {
   width: 30%;
+}
 
-  .filters {
-    border: 1px solid var.$grey-2;
-    border-radius: 12px;
-    padding: 0 1.7rem 0 1.7rem;
-    display: flex;
-    flex-direction: column;
-    row-gap: 0.8rem;
-    height: fit-content;
-  }
+.filters {
+  border: 1px solid var(--grey-2);
+  border-radius: 12px;
+  padding: 0 1.7rem 0 1.7rem;
+  display: flex;
+  flex-direction: column;
+  row-gap: 0.8rem;
+  height: fit-content;
 }

src/app/features/my-profile/components/my-profile-resource-filters/my-profile-resource-filters.component.ts

@@ -38,57 +38,57 @@ import { MyProfileResourceFiltersOptionsSelectors } from '../filters/store';
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MyProfileResourceFiltersComponent {
-  readonly #store = inject(Store);
+  readonly store = inject(Store);
 
   readonly datesOptionsCount = computed(() => {
-    return this.#store
+    return this.store
       .selectSignal(MyProfileResourceFiltersOptionsSelectors.getDatesCreated)()
       .reduce((accumulator, date) => accumulator + date.count, 0);
   });
 
   readonly funderOptionsCount = computed(() => {
-    return this.#store
+    return this.store
       .selectSignal(MyProfileResourceFiltersOptionsSelectors.getFunders)()
       .reduce((acc, item) => acc + item.count, 0);
   });
 
   readonly subjectOptionsCount = computed(() => {
-    return this.#store
+    return this.store
       .selectSignal(MyProfileResourceFiltersOptionsSelectors.getSubjects)()
       .reduce((acc, item) => acc + item.count, 0);
   });
 
   readonly licenseOptionsCount = computed(() => {
-    return this.#store
+    return this.store
       .selectSignal(MyProfileResourceFiltersOptionsSelectors.getLicenses)()
       .reduce((acc, item) => acc + item.count, 0);
   });
 
   readonly resourceTypeOptionsCount = computed(() => {
-    return this.#store
+    return this.store
       .selectSignal(MyProfileResourceFiltersOptionsSelectors.getResourceTypes)()
       .reduce((acc, item) => acc + item.count, 0);
   });
 
   readonly institutionOptionsCount = computed(() => {
-    return this.#store
+    return this.store
       .selectSignal(MyProfileResourceFiltersOptionsSelectors.getInstitutions)()
       .reduce((acc, item) => acc + item.count, 0);
   });
 
   readonly providerOptionsCount = computed(() => {
-    return this.#store
+    return this.store
       .selectSignal(MyProfileResourceFiltersOptionsSelectors.getProviders)()
       .reduce((acc, item) => acc + item.count, 0);
   });
 
   readonly partOfCollectionOptionsCount = computed(() => {
-    return this.#store
+    return this.store
       .selectSignal(MyProfileResourceFiltersOptionsSelectors.getPartOfCollection)()
       .reduce((acc, item) => acc + item.count, 0);
   });
 
-  readonly isMyProfilePage = this.#store.selectSignal(MyProfileSelectors.getIsMyProfile);
+  readonly isMyProfilePage = this.store.selectSignal(MyProfileSelectors.getIsMyProfile);
 
   readonly anyOptionsCount = computed(() => {
     return (

src/app/features/my-profile/components/my-profile-resource-filters/store/my-profile-resource-filters.state.ts

@@ -19,18 +19,17 @@ import {
 } from './my-profile-resource-filters.actions';
 import { MyProfileResourceFiltersStateModel } from './my-profile-resource-filters.model';
 
-// Store for user selected filters values
 @State<MyProfileResourceFiltersStateModel>({
   name: 'myProfileResourceFilters',
   defaults: resourceFiltersDefaults,
 })
 @Injectable()
 export class MyProfileResourceFiltersState implements NgxsOnInit {
-  #store = inject(Store);
-  #currentUser = this.#store.select(UserSelectors.getCurrentUser);
+  store = inject(Store);
+  currentUser = this.store.select(UserSelectors.getCurrentUser);
 
   ngxsOnInit(ctx: StateContext<MyProfileResourceFiltersStateModel>) {
-    this.#currentUser.subscribe((user) => {
+    this.currentUser.subscribe((user) => {
       if (user) {
         ctx.patchState({
           creator: {

src/app/features/my-profile/components/my-profile-resources/my-profile-resources.component.html

@@ -1,34 +1,28 @@
 <div class="flex justify-content-between align-items-start pb-3 column-gap-3">
   <div class="flex flex-1 flex-column row-gap-7">
     @if (isMobile()) {
-      <p-select
-        class="text-center"
-        [(ngModel)]="selectedTab"
-        [options]="tabsOptions"
-        optionLabel="label"
-        optionValue="value"
-      ></p-select>
+      <osf-select class="text-center" [options]="tabsOptions" [(selectedValue)]="selectedTab"></osf-select>
     }
+
     @if (searchCount() > 10000) {
-      <h3>10 000+ results</h3>
+      <h3 class="highlight">{{ 'collections.searchResults.10000results' | translate }}</h3>
     } @else if (searchCount() > 0) {
-      <h3>{{ searchCount() }} results</h3>
+      <h3>{{ searchCount() }} {{ 'collections.searchResults.results' | translate }}</h3>
     } @else {
-      <h3>0 results</h3>
+      <h3 class="highlight">{{ 'collections.searchResults.noResults' | translate }}</h3>
     }
   </div>
 
   <div class="sorting-container">
     @if (isWeb()) {
-      <h3>Sort by:</h3>
-      <p-select
-        class="no-border-dropdown font-bold"
+      <h3>{{ 'collections.filters.sortBy' | translate }}:</h3>
+      <osf-select
+        class="ml-1 font-bold"
         [options]="searchSortingOptions"
-        optionLabel="label"
-        optionValue="value"
+        [noBorder]="true"
         appendTo="body"
-        [(ngModel)]="selectedSort"
-      ></p-select>
+        [(selectedValue)]="selectedSort"
+      ></osf-select>
     } @else {
       @if (isAnyFilterOptions()) {
         <p-button severity="secondary" icon="fas fa-sliders" size="large" (click)="openFilters()"></p-button>