Merge pull request #2133 from Sefaria/feature/sc-29228/library-integr…

…ating-notes-into-history-saved Integrating Notes into History & Saved
Sefaria · Dec 11, 2024 · a5e28ee · a5e28ee
2 parents e8c713b + acfd76a
commit a5e28ee
Show file tree

Hide file tree

Showing 8 changed files with 66 additions and 14 deletions.
diff --git a/reader/views.py b/reader/views.py
@@ -1072,6 +1072,11 @@ def user_history(request):
     desc = _("See your user history on Sefaria")
     return menu_page(request, props, page="history", title=title, desc=desc)
 
+@login_required
+def notes(request):
+    title = _("My Notes")
+    desc = _("See your notes on Sefaria")
+    return menu_page(request, page="notes", title=title, desc=desc)
 
 @login_required
 def user_stats(request):

diff --git a/sefaria/urls.py b/sefaria/urls.py
@@ -30,6 +30,7 @@
     url(r'^$', reader_views.home, name="home"),
     url(r'^texts/?$', reader_views.texts_list, name="table_of_contents"),
     url(r'^texts/saved/?$', reader_views.saved),
+    url(r'^texts/notes/?$', reader_views.notes),
     url(r'^texts/history/?$', reader_views.user_history),
     url(r'^texts/recent/?$', reader_views.old_recent_redirect),
     url(r'^texts/(?P<cats>.+)?$', reader_views.texts_category_list),

diff --git a/static/css/s2.css b/static/css/s2.css
@@ -9180,6 +9180,7 @@ div.aboutSheetMetadata span:not(:first-child)::before{
 .noteListing {
   margin-bottom: 30px;
   border-bottom: 1px solid #ccc;
+  padding-bottom: 10px;
 }
 .noteListing a:hover {
   text-decoration: none;

diff --git a/static/icons/notes-icon.svg b/static/icons/notes-icon.svg
diff --git a/static/js/NoteListing.jsx b/static/js/NoteListing.jsx
@@ -2,7 +2,7 @@ import React  from 'react';
 import $  from './sefaria/sefariaJquery';
 import Sefaria  from './sefaria/sefaria';
 import { AddToSourceSheetWindow } from './AddToSourceSheet';
-import { Note } from './Misc';
+import { Note, LoadingMessage } from './Misc';
 import PropTypes  from 'prop-types';
 import Component      from 'react-class';
 
@@ -59,11 +59,17 @@ class NoteListing extends Component {
 }
 NoteListing.propTypes = {
   data:         PropTypes.object.isRequired,
-  showText:     PropTypes.bool,
   onDeleteNote: PropTypes.func,
 };
-NoteListing.defaultProps = {
-  showText: true
-};
+
+const NotesList = ({notes}) => {  
+  return (
+    notes && notes.length ? 
+      notes.map((item, i) => (
+        <NoteListing data={item} key={i} />
+      ))
+    : <LoadingMessage message="You haven't written any notes yet." heMessage="טרם הוספת רשומות משלך" />)};
+
 
 export default NoteListing;
+export { NotesList };
diff --git a/static/js/ReaderApp.jsx b/static/js/ReaderApp.jsx
@@ -571,6 +571,12 @@ class ReaderApp extends Component {
             hist.title = Sefaria._("My Reading History");
             hist.url = "texts/history";
             hist.mode = "history";
+            break;
+          case "notes":
+            hist.title = Sefaria._("My Notes");
+            hist.url = "texts/notes";
+            hist.mode = "notes";
+            break;
         }
         hist.url = addTab(hist.url)
       } else if (state.mode === "Text") {
@@ -1131,6 +1137,9 @@ toggleSignUpModal(modalContentKind = SignUpModalKind.Default) {
     } else if (path === "/texts/saved") {
       this.showSaved();
 
+    } else if (path === "/texts/notes") {
+      this.showNotes();
+
     } else if (path.match(/\/texts\/.+/)) {
       this.showLibrary(path.slice(7).split("/"));
 
@@ -1757,6 +1766,9 @@ toggleSignUpModal(modalContentKind = SignUpModalKind.Default) {
   showSaved() {
     this.setSinglePanelState({menuOpen: "saved"});
   }
+  showNotes() {
+    this.setSinglePanelState({menuOpen: "notes"});
+  }
   showHistory() {
     this.setSinglePanelState({menuOpen: "history"});
   }

diff --git a/static/js/ReaderPanel.jsx b/static/js/ReaderPanel.jsx
@@ -1064,7 +1064,7 @@ class ReaderPanel extends Component {
           interfaceLang={this.props.interfaceLang} />
       );
 
-    } else if (this.state.menuOpen === "saved" || this.state.menuOpen === "history") {
+    } else if (["saved", "history", "notes"].includes(this.state.menuOpen)) {
       menu = (
           <UserHistoryPanel
               multiPanel={this.props.multiPanel}

diff --git a/static/js/UserHistoryPanel.jsx b/static/js/UserHistoryPanel.jsx
@@ -5,6 +5,7 @@ import Component from 'react-class';
 import Sefaria  from './sefaria/sefaria';
 import { useScrollToLoad } from "./Hooks";
 import { NavSidebar } from './NavSidebar';
+import { NotesList } from './NoteListing';
 import { 
   SheetBlock,
   TextPassage
@@ -21,9 +22,23 @@ import {
 
 
 const UserHistoryPanel = ({menuOpen, toggleLanguage, openDisplaySettings, openNav, compare, toggleSignUpModal}) => {
-  const store = menuOpen === "saved" ? Sefaria.saved : Sefaria.userHistory;
+  const [notes, setNotes] = useState(null);
   const contentRef = useRef();
 
+  useEffect(() => {
+    Sefaria.allPrivateNotes((data) => {
+      if (Array.isArray(data)) {
+        const flattenedNotes = data.map(note => ({
+          ref: note.ref,
+          text: note.text
+        }));
+        setNotes(flattenedNotes); 
+      } else {
+        console.error("Unexpected data format:", data);
+      }
+    });
+  }, []);
+
   const title = (
     <span className="sans-serif">
       <a href="/texts/saved" className={"navTitleTab" + (menuOpen === "saved" ? " current" : "")}>
@@ -34,6 +49,10 @@ const UserHistoryPanel = ({menuOpen, toggleLanguage, openDisplaySettings, openNa
         <img src="/static/icons/clock.svg" />
         <InterfaceText>History</InterfaceText>
       </a>
+      <a href="/texts/notes" className={"navTitleTab" + (menuOpen === "notes" ? " current" : "")}> 
+        <img src="/static/icons/notes-icon.svg" /> 
+        <InterfaceText>Notes</InterfaceText>
+      </a>
     </span>
   );
 
@@ -55,19 +74,24 @@ const UserHistoryPanel = ({menuOpen, toggleLanguage, openDisplaySettings, openNa
               {Sefaria.interfaceLang !== "hebrew" && Sefaria._siteSettings.TORAH_SPECIFIC ?
               <LanguageToggleButton toggleLanguage={toggleLanguage} /> : null}
             </div>
-            <UserHistoryList
-              store={store}
-              scrollableRef={contentRef}
-              menuOpen={menuOpen}
-              toggleSignUpModal={toggleSignUpModal}
-              key={menuOpen}/>
+            { menuOpen === "notes" ?
+                  <NotesList notes={notes} />
+                 :
+                  <UserHistoryList
+                    store={menuOpen === "saved" ? Sefaria.saved : Sefaria.userHistory}
+                    scrollableRef={contentRef}
+                    menuOpen={menuOpen}
+                    toggleSignUpModal={toggleSignUpModal}
+                    key={menuOpen}/>
+            }
           </div>
           <NavSidebar modules={sidebarModules} />
         </div>
       </div>
     </div>
-    );
+  );
 };
+
 UserHistoryPanel.propTypes = {
   toggleLanguage:      PropTypes.func.isRequired,
   openDisplaySettings: PropTypes.func.isRequired,