Merge pull request #1187 from concord-consortium/180951907-display-library-interactive-name-in-authoring

feat: Display Library Interactive name in authoring [PT-#180951907]

Author: dougmartin

app/assets/javascripts/lara-typescript.js

@@ -135926,10 +135926,10 @@ var use_current_user_1 = __webpack_require__(/*! ../common/hooks/use-current-use
 
 var authored_state_1 = __webpack_require__(/*! ../common/components/authored-state */ "./src/page-item-authoring/common/components/authored-state.tsx");
 
-__webpack_require__(/*! react-tabs/style/react-tabs.css */ "./node_modules/react-tabs/style/react-tabs.css");
-
 var use_authoring_preview_1 = __webpack_require__(/*! ../common/hooks/use-authoring-preview */ "./src/page-item-authoring/common/hooks/use-authoring-preview.ts");
 
+__webpack_require__(/*! react-tabs/style/react-tabs.css */ "./node_modules/react-tabs/style/react-tabs.css");
+
 var ManagedInteractiveAuthoring = function (props) {
   var libraryInteractive = props.libraryInteractive,
       managedInteractive = props.managedInteractive,
@@ -135968,7 +135968,14 @@ var ManagedInteractiveAuthoring = function (props) {
 
     return React.createElement(React.Fragment, null, React.createElement("div", {
       className: "interactiveItemID"
-    }, "InteractiveID: ", managedInteractive.interactive_item_id), React.createElement("fieldset", null, React.createElement("label", {
+    }, "InteractiveID: ", managedInteractive.interactive_item_id), React.createElement("div", {
+      title: managedInteractive.library_interactive_base_url,
+      style: {
+        margin: "1rem 0",
+        fontWeight: "bold",
+        fontSize: "1rem"
+      }
+    }, managedInteractive.library_interactive_name, " (#", managedInteractive.library_interactive_id, ")"), React.createElement("fieldset", null, React.createElement("label", {
       htmlFor: "name"
     }, "Name"), React.createElement("input", {
       type: "text",

app/models/managed_interactive.rb

@@ -131,6 +131,8 @@ def to_hash
     # Deliberately ignoring user (will be set in duplicate)
     {
       library_interactive_id: library_interactive_id,
+      library_interactive_name: library_interactive ? library_interactive.name : nil,
+      library_interactive_base_url: library_interactive ? library_interactive.base_url : nil,
       name: name,
       url_fragment: url_fragment,
       authored_state: authored_state,
@@ -211,7 +213,8 @@ def to_interactive
   def duplicate
     # Remove linked_interactives from the hash since it can't be mapped to a database column like the other
     # properties in the hash can, and so causes an error when we try to create the duplicate interactive.
-    new_interactive_hash = self.to_hash.except!(:linked_interactives)
+    # Also remove the library interactive name and base url which are only used by the authoring interface.
+    new_interactive_hash = self.to_hash.except!(:linked_interactives, :library_interactive_name, :library_interactive_base_url)
     # Generate a new object with those values
     ManagedInteractive.new(new_interactive_hash)
     # N.B. the duplicate hasn't been saved yet
@@ -229,7 +232,8 @@ def report_service_hash
   def export
     # Remove linked_interactives from the hash so we don't export linked embeddables. The export method
     # in LaraSerializationHelper provides special handling for this value. See comment there for more.
-    hash = to_hash().except!(:linked_interactives)
+    # Also remove the library interactive name and base url which are only used by the authoring interface.
+    hash = to_hash().except!(:linked_interactives, :library_interactive_name, :library_interactive_base_url)
     hash.delete(:library_interactive_id)
     hash[:library_interactive] = library_interactive ? {
       data: library_interactive.to_hash()

lara-typescript/src/page-item-authoring/managed-interactives/index.tsx

@@ -9,9 +9,9 @@ import { useCurrentUser } from "../common/hooks/use-current-user";
 import { AuthoredState } from "../common/components/authored-state";
 import { AuthoringApiUrls } from "../common/types";
 import { ILinkedInteractive } from "../../interactive-api-client";
+import { useAuthoringPreview } from "../common/hooks/use-authoring-preview";
 
 import "react-tabs/style/react-tabs.css";
-import { useAuthoringPreview } from "../common/hooks/use-authoring-preview";
 
 interface Props {
   managedInteractive: IManagedInteractive;
@@ -25,6 +25,8 @@ interface Props {
 export interface IManagedInteractive {
   id: number;
   library_interactive_id: number;
+  library_interactive_name: string;
+  library_interactive_base_url: string;
   name: string;
   url_fragment: string;
   authored_state: string;
@@ -90,6 +92,14 @@ export const ManagedInteractiveAuthoring: React.FC<Props> = (props) => {
       <div className="interactiveItemID">
         InteractiveID: {managedInteractive.interactive_item_id}
       </div>
+
+      <div
+        title={managedInteractive.library_interactive_base_url}
+        style={{margin: "1rem 0", fontWeight: "bold", fontSize: "1rem"}}
+      >
+        {managedInteractive.library_interactive_name} (#{managedInteractive.library_interactive_id})
+      </div>
+
       <fieldset>
         <label htmlFor="name">Name</label>
         <input

spec/models/managed_interactive_spec.rb

@@ -49,6 +49,8 @@
     it 'has useful values' do
       expected = {
         library_interactive_id: managed_interactive.library_interactive_id,
+        library_interactive_name: managed_interactive.library_interactive.name,
+        library_interactive_base_url: managed_interactive.library_interactive.base_url,
         name: managed_interactive.name,
         url_fragment: managed_interactive.url_fragment,
         authored_state: managed_interactive.authored_state,