ShadCN UI main (#1589)

* wire up project picker

* show the current project as selected in the dropdown

* Playwright screenshots for fw lite ui (#1590)

* setup screenshot testing using playwright

* ensure UI is consistent for tests by removing date from dev version and by not changing the sync icon

---------

Co-authored-by: Tim Haasdyk <[email protected]>

* change index.html in viewer so when you open it you're taken to /testing/project-view

* Migrate dialogs to shadcn (#1612)

* use shadCn dialog for NewEntryDialog

* Refactor DeleteDialog to use the ShadCN dialog

* use ShadCN dialog in ActivityView.svelte and HistoryView.svelte

* convert About and Troubleshooting Dialog to use shadCN

---------

Co-authored-by: Tim Haasdyk <[email protected]>

* Use runes for project services (#1593)

* change writing system service to use runes and the new project context.

* use project context for history service

* fix proxy issues due to some rune and resource stuff

* setup parts of speech service

* migrate complex form types to use runes

* run CI on PRs for shadcn main

* fix up viewer to work with new project context

* fix up viewer-specific lint errors by using project context for tests

* Refactor editor classes to editor components (#1619)

* Refactor editor classes to editor components

* Extract editor sandbox into own component

* Fix invalid binding

* Introduce editor root and name editor container

---------

Co-authored-by: Kevin Hahn <[email protected]>

* Migrate entry select dialog (#1620)

* use a boundry on failing areas in the sandbox. Tweak index.html to only send to testing when the path is empty

* convert EntryOrSensePicker.svelte to svelte 5 and ShadCN

* use a ring to indicate selection of entry rows

* move new entry dialog and delete dialog to use a new dialog service based on project context

* migrate save handler

* pull Add entry button out of sidebar and create SidebarPrimaryAction.svelte which will place a button in the sidebar with context of the current view.

* Fix stacking dialogs

* Fix selecting newly created entry

---------

Co-authored-by: Tim Haasdyk <[email protected]>

* Shadcn Single-select (#1623)

* Fix sandbox

* Make Editor.Field.Body only 1 column by default

* Add note to sandbox editor

* Remove min-height from multi-select on desktop

* Add single-select component to sandbox editor

* Remove badge from empty single-select

* Incorporate PR feedback

* Make rich-text-editor support readonly mode (#1624)

* Make rich-text-editor support readonly mode

* add a checkbox to toggle readonly mode on sandbox. Wrap the rich editor with label in a div otherwise the cursor is incorrect when hovering over the editor.

---------

Co-authored-by: Kevin Hahn <[email protected]>

* Ensure user can tab to readonly rich-text just like other inputs (#1638)

* Fix entry view and filter outline overflow (#1639)

* Fix entry-view scroll-area overflowing parent

* Prevent new-entry-button from being covered up by sidebar menu items

* Fix filter-field outline overflowing and tweak padding/margins

* Make refresh button more distinct and animation less jittery

* Use icon button size for entry-view icon buttons

* Add gap between entry-view icon buttons

* WS single and multi inputs (#1637)

* Add radio button comment for our future selves

* Add multi-ws-input and simple inputs to sandbox editor

* Fix up readonly field-editor props

* Put value preview beside sandbox editor

* hook up delete buttons in new project view (#1635)

* add new EntryDeletedEvent and notify on delete from sync or the notify wrapper

* introduce a project event bus use the bus for entry deleted events

* document how to use shadcn

* add a right click menu to the entries list to enable deleting entries

* add open in new to entry menu

* use entry menu for entry list context menu
closes #1640

---------

Co-authored-by: Tim Haasdyk <[email protected]>

* display a dictionary preview on the entry list (#1641)

* display a dictionary preview on the entry list

* make sense numbers links in dictionary preview

* show dictionary preview in the entry view

* allow making the preview sticky

---------

Co-authored-by: Tim Haasdyk <[email protected]>

* update bits ui to fix issue on popup close

* Tweak muted backgrounds (#1647)

* 1636 editor layout (#1654)

* Introduce EntryEditorPrimitive

* Rename SenseEditor to SenseEditorPrimitive. That's what it is.

* Rename ExampleEditor to ExampleEditorPrimitive

* Replace grid-layer class with EditorSubGrid component

* Add onchange events to fields

* Truncate selects to first 100 filtered items with hint at end of truncated list

* Introduce view-text helper/type for lite vs classic texts

* Add readonly dev toggle.

* Wrap editor in Editor.Root

* Migrate sense fields to shadcn

* Migrate entry fields to shadcn

* Migrate example sentence fields to shadcn

* Some clean up

* Extend pickViewText api and translate editor headers

* Silence warnings by binding entry objects

* Fix field borders peeking around side of sticky header at some zoom-levels.

* Fix matching projects (#1653)

* Fix can't open fwdata projects if crdt project with same code exists

* Reuse Lexbox project name for fwdata projects

* Fix crdt copy not shown in project-picker if fwdata copy exists. And sort.

* Fix crdt and fwdata copies always highlighted together on hover

* Fix current fwdata project not highlighted in project-picker if crdt copy also exists

* Fix both crdt and fwdata copies of current project highlighted in project-picker

* Fix: project code not shown on synced server projects

* Migrate components, complex forms and sense and example sentence actions (#1655)

* Make icon and icon buttons support baseline alignment

* Migrate component and complex-forms to shadcn/Svelte 5

* Prevent focus rings from being clipped and tweak preview position on mobile

* Migrate rest of editor to Svelte 5 and shadcn

* Remove reorderer-swapper and use svelte-context in reorderr hierarchy

* Make new sense FAB look like new entry FAB

* Rehide reorderer if only 1 item

* Move pickIcon into the only component that now uses it

* write a sandbox test for the reorderer

* translate delete prompt text

* Use getters instead of $state so root-props react to updates.

* Use simple $derived.by instead of watch

---------

Co-authored-by: Kevin Hahn <[email protected]>

* Url state tracking (ShadCN) (#1662)

* create QueryParamState to enable reactive url params

* fix bug in EntryOrSenseItemList.svelte to remove a trailing `}` from the query parameter

* make the browse view `selectedEntryId` reactive based on query params

* make dialogs reactive to url and the back button

* use router for handling browse and tasks views

* add a fallback default route in the project view

---------

Co-authored-by: Tim Haasdyk <[email protected]>

* hide audio writing systems since we don't support them

* fix linting

* remove svelte ux from tailwind (#1664)

* add a border to an empty server list

* migrate LocalizationPicker.svelte to use Shad CN and not the Svelte UX menu

* slide icons and loading indicator on change

* remove svelte-ux on sandbox page

---------

Co-authored-by: Tim Haasdyk <[email protected]>

* fix icon button styles, add a sandbox which shows button configurations

* Don't run install 3 times (#1669)

* cleanup lint errors

* fix DictionaryEntry.svelte links

* show history when clicking the history button on an entry

* Finalize shadcn buttons (#1670)

* Fix delete dialog close detection

* Wire up sidebar and hide unimplemented content

* Migrate home-page app-bar buttons to shadcn

* Use function instead of prop to open troubleshooting dialog

* Fix broken enter animation due to troubleshooting dialog resize after open.

* Introduce responsive-menu for entry-menu

* Add Open in FieldWorks button

* Fix logo doesn't respond to dark-mode

* Condense home-view app-bar

* Make radio buttons bigger on mobile

* only show Open In Flex button when supported

---------

Co-authored-by: Kevin Hahn <[email protected]>

* fix lint error

* fix more lint errors

* Persist changes in EntryView.svelte (#1671)

* notify entry changes when sense or example are deleted

* make entry persistence service to attach to entry editor

* Use project-code for detecting project events

* Fix entry ID mismatch after changing entries

---------

Co-authored-by: Tim Haasdyk <[email protected]>

* Setup back handler (#1673)

* add QueryParamState option for using replace when a default value is set

* replace dialogs using QueryParamState with `useBackHandler`

* use back handler in drawer on mobile. Cleanup back handler when it's component is destroyed

* handle case where we navigate from an open dialog and warn that history was not cleaned up

* Make svelte-check and lint happy

---------

Co-authored-by: Tim Haasdyk <[email protected]>

Author: hahn-kev

.github/workflows/fw-lite.yaml

@@ -21,6 +21,7 @@ on:
     branches:
       - develop
       - main
+      - shadcn-ui-main #just for now ensure PRs to this branch have checks run
 env:
   VIEWER_BUILD_OUTPUT_DIR: backend/FwLite/FwLiteShared/wwwroot/viewer
 jobs:

backend/FwLite/FwLiteShared/Events/EntryDeletedEvent.cs

@@ -0,0 +1,8 @@
+namespace FwLiteShared.Events;
+
+public class EntryDeletedEvent(Guid entryId) : IFwEvent
+{
+    public FwEventType Type => FwEventType.EntryDeleted;
+    public bool IsGlobal => false;
+    public Guid EntryId { get; init; } = entryId;
+}

backend/FwLite/FwLiteShared/Events/IFwEvent.cs

@@ -4,6 +4,7 @@ namespace FwLiteShared.Events;
 
 [JsonPolymorphic]
 [JsonDerivedType(typeof(EntryChangedEvent), nameof(EntryChangedEvent))]
+[JsonDerivedType(typeof(EntryDeletedEvent), nameof(EntryDeletedEvent))]
 [JsonDerivedType(typeof(ProjectEvent), nameof(ProjectEvent))]
 [JsonDerivedType(typeof(AuthenticationChangedEvent), nameof(AuthenticationChangedEvent))]
 public interface IFwEvent
@@ -19,4 +20,5 @@ public enum FwEventType
     EntryChanged,
     AuthenticationChanged,
     ProjectEvent,
+    EntryDeleted
 }

backend/FwLite/FwLiteShared/Pages/CrdtProject.razor

@@ -1,8 +1,10 @@
-@page "/project/{projectName}"
+@page "/project/{projectName}/{*path}"
 @using FwLiteShared.Layout
 @layout SvelteLayout;
 
 @code {
     [Parameter]
     public required string ProjectName { get; set; }
+    [Parameter]
+    public required string Path { get; set; }
 }

backend/FwLite/FwLiteShared/Pages/FwdataProject.razor

@@ -1,10 +1,12 @@
-@page "/fwdata/{projectName}"
+@page "/fwdata/{projectName}/{*path}"
 @using FwLiteShared.Layout
 @layout SvelteLayout;
 
 @code {
 
     [Parameter]
     public required string ProjectName { get; set; }
+    [Parameter]
+    public required string Path { get; set; }
 
 }

backend/FwLite/FwLiteShared/Pages/Sandbox.razor

@@ -1,6 +1,11 @@
-@page "/sandbox"
+@page "/sandbox/{*path}"
 @using FwLiteShared.Layout
 @using FwLiteShared.Services
 @layout SvelteLayout;
 
-@*this looks empty because it is, but it's required to declare the route which is then used by the svelte router*@
+@code {
+
+    [Parameter]
+    public required string Path { get; set; }
+
+}

backend/FwLite/FwLiteShared/Pages/TestingProject.razor

@@ -1,3 +1,10 @@
-@page "/testing/project-view"
+@page "/testing/project-view/{*path}"
 @using FwLiteShared.Layout
 @layout SvelteLayout;
+
+@code {
+
+    [Parameter]
+    public required string Path { get; set; }
+
+}

backend/FwLite/FwLiteShared/Services/MiniLcmApiNotifyWrapper.cs

@@ -72,6 +72,11 @@ public async Task NotifyEntryChangedAsync(Guid entryId)
         bus.PublishEntryChangedEvent(project, entry);
     }
 
+    public void NotifyEntryDeleted(Guid entryId)
+    {
+        bus.PublishEvent(project, new EntryDeletedEvent(entryId));
+    }
+
     // ********** Overrides go here **********
 
     async Task<Entry> IMiniLcmWriteApi.CreateEntry(Entry entry)
@@ -105,6 +110,24 @@ async Task IMiniLcmWriteApi.DeleteComplexFormComponent(ComplexFormComponent comp
         await NotifyEntryChangedAsync(complexFormComponent.ComponentEntryId);
     }
 
+    async Task IMiniLcmWriteApi.DeleteEntry(Guid id)
+    {
+        await _api.DeleteEntry(id);
+        NotifyEntryDeleted(id);
+    }
+
+    async Task IMiniLcmWriteApi.DeleteSense(Guid entryId, Guid senseId)
+    {
+        await _api.DeleteSense(entryId, senseId);
+        await NotifyEntryChangedAsync(entryId);
+    }
+
+    async Task IMiniLcmWriteApi.DeleteExampleSentence(Guid entryId, Guid senseId, Guid exampleSentenceId)
+    {
+        await _api.DeleteExampleSentence(entryId, senseId, exampleSentenceId);
+        await NotifyEntryChangedAsync(entryId);
+    }
+
     void IDisposable.Dispose()
     {
     }

backend/FwLite/FwLiteShared/Sync/SyncService.cs

@@ -10,6 +10,7 @@
 using MiniLcm;
 using MiniLcm.Models;
 using SIL.Harmony;
+using SIL.Harmony.Changes;
 
 namespace FwLiteShared.Sync;
 
@@ -95,6 +96,13 @@ private async Task SendNotifications(SyncResults syncResults)
                     logger.LogError("Failed to get entry {EntryId}, was not found", entryId);
                 }
             }
+
+            foreach (var deleteChange in syncResults.MissingFromLocal
+                         .SelectMany(c => c.ChangeEntities, (_, change) => change.Change)
+                         .OfType<DeleteChange<Entry>>())
+            {
+                changeEventBus.PublishEvent(currentProjectService.Project, new EntryDeletedEvent(deleteChange.EntityId));
+            }
         }
         catch (Exception e)
         {

backend/FwLite/FwLiteWeb/Routes/FwIntegrationRoutes.cs

@@ -20,7 +20,7 @@ public static IEndpointConventionBuilder MapFwIntegrationRoutes(this WebApplicat
                 });
                 return operation;
             });
-        group.MapGet("/open/entry/{id}",
+        group.MapGet("/link/entry/{id}",
             async ([FromServices] FwDataProjectContext context,
                 [FromServices] IHubContext<FwDataMiniLcmHub, ILexboxHubClient> hubContext,
                 [FromServices] FwDataFactory factory,
@@ -29,8 +29,8 @@ public static IEndpointConventionBuilder MapFwIntegrationRoutes(this WebApplicat
                 if (context.Project is null) return Results.BadRequest("No project is set in the context");
                 await hubContext.Clients.Group(context.Project.Name).OnProjectClosed(CloseReason.Locked);
                 factory.CloseProject(context.Project);
-                //need to use redirect as a way to not trigger flex until after we have closed the project
-                return Results.Redirect(FwLink.ToEntry(id, context.Project.Name));
+                var link = FwLink.ToEntry(id, context.Project.Name);
+                return Results.Text(link, "text/plain");
             });
         return group;
     }