First bits of feedback

- Tweak wording to be inline with latest changes
- Update page on mobile to not look terrible
- Link the wiki page
- Make it more clear when a name can be changed

UI/Web/src/app/_models/wiki.ts

@@ -20,5 +20,6 @@ export enum WikiLink {
   UpdateNative = 'https://wiki.kavitareader.com/guides/updating/updating-native',
   UpdateDocker = 'https://wiki.kavitareader.com/guides/updating/updating-docker',
   OpdsClients = 'https://wiki.kavitareader.com/guides/features/opds/#opds-capable-clients',
-  Guides = 'https://wiki.kavitareader.com/guides'
+  Guides = 'https://wiki.kavitareader.com/guides',
+  ReadingProfiles = "https://wiki.kavitareader.com/guides/user-settings/reading-profiles/",
 }

UI/Web/src/app/user-settings/manage-reading-profiles/manage-reading-profiles.component.html

@@ -10,13 +10,13 @@
     </div>
 
     <p class="ps-2">{{t('description')}}</p>
-    <p class="ps-2 text-muted">{{t('extra-tip')}}</p>
+    <p class="ps-2 text-muted">{{t('extra-tip')}} <a target="_blank" [href]="WikiLink.ReadingProfiles">{{t('wiki-title')}}</a></p>
 
 
     <div class="row g-0 ">
 
-      <div class="col-lg-3 col-md-5 col-sm-7 col-xs-7 scroller">
+      <div class="col-lg-3 col-md-5 col-sm-7 col-xs-7 scroller mb-2 mb-sm-0">
-        <div class="pe-2">
+        <div class="pe-sm-2">
 
           @if (readingProfiles.length < virtualScrollerBreakPoint) {
             @for (readingProfile of readingProfiles; track readingProfile.id) {
@@ -32,7 +32,7 @@
         </div>
       </div>
 
-      <div class="col-lg-9 col-md-7 col-sm-4 col-xs-4 ps-3">
+      <div class="col-lg-9 col-md-7 col-sm-4 col-xs-4 ps-0 ps-sm-3">
         <div class="card p-3">
           @if (selectedProfile === null) {
             <p class="ps-2">{{t('no-selected')}}</p>
@@ -46,7 +46,9 @@
               <div class="mb-2 d-flex justify-content-between align-items-center">
                 <app-setting-item [title]="''" [showEdit]="false" [canEdit]="selectedProfile.kind !== ReadingProfileKind.Default">
                   <ng-template #view>
-                    {{readingProfileForm.get('name')!.value}}
+                    <span [class.cursor-click]="selectedProfile.kind !== ReadingProfileKind.Default">
+                      {{readingProfileForm.get('name')!.value}}
+                    </span>
                   </ng-template>
                   <ng-template #edit>
                     <input class="form-control" type="text" formControlName="name" [disabled]="selectedProfile.kind === ReadingProfileKind.Default">

UI/Web/src/app/user-settings/manage-reading-profiles/manage-reading-profiles.component.scss

@@ -1,6 +1,9 @@
 @use '../../../series-detail-common';
 
 
+.cursor-click {
+  cursor: pointer;
+}
 
 .group-item {
   background-color: transparent;

UI/Web/src/app/user-settings/manage-reading-profiles/manage-reading-profiles.component.ts

@@ -47,6 +47,7 @@ import {takeUntilDestroyed} from "@angular/core/rxjs-interop";
 import {LoadingComponent} from "../../shared/loading/loading.component";
 import {ToastrService} from "ngx-toastr";
 import {ConfirmService} from "../../shared/confirm.service";
+import {WikiLink} from "../../_models/wiki";
 
 enum TabId {
   ImageReader = "image-reader",
@@ -237,10 +238,10 @@ export class ManageReadingProfilesComponent implements OnInit {
     } else {
       const profile = this.packData();
       this.readingProfileService.updateProfile(profile).subscribe({
-        next: _ => {
+        next: newProfile => {
           this.readingProfiles = this.readingProfiles.map(p => {
             if (p.id !== profile.id) return p;
-            return profile;
+            return newProfile;
           });
           this.cdRef.markForCheck();
         },
@@ -316,4 +317,5 @@ export class ManageReadingProfilesComponent implements OnInit {
   protected readonly pdfScrollModes = pdfScrollModes;
   protected readonly TabId = TabId;
   protected readonly ReadingProfileKind = ReadingProfileKind;
+  protected readonly WikiLink = WikiLink;
 }

UI/Web/src/assets/langs/en.json

@@ -2825,7 +2825,8 @@
 
     "manage-reading-profiles": {
         "description": "Not all your series may be read in the same way, set up distinct reading profiles per library or series to make getting back in your series as seamless as possible.",
-        "extra-tip": "Assign reading profiles via the action menu on series and libraries, or in bulk. When changing settings in a reader, a hidden profile is created that remembers your choices for that series (not for pdfs). This profile is removed when you assign or update one of your own reading profiles to the series.",
+        "extra-tip": "Assign reading profiles via the action menu on series and libraries, or in bulk. When changing settings in a reader, a hidden profile is created that remembers your choices for that series (not for pdfs). This profile is removed when you assign one of your own reading profiles to the series. More information can be found on the",
+        "wiki-title": "wiki",
         "profiles-title": "Your reading profiles",
         "default-profile": "Default",
         "add": "{{common.add}}",