Merge pull request #1658 from KhalisFoundation/dev

Release PR 1.15.0 (Gurbani Chat Bot and few other fixes)
KhalisFoundation · Aug 8, 2023 · 7cdc25c · 7cdc25c
2 parents 011a031 + 82ea445
commit 7cdc25c
Show file tree

Hide file tree

Showing 22 changed files with 224 additions and 117 deletions.
diff --git a/common/api-urls-constants.js b/common/api-urls-constants.js
@@ -13,5 +13,6 @@ module.exports = {
   },
   CEREMONIES: '//api.sikhitothemax.org/ceremonies/',
   DOODLE: '//api.sikhitothemax.org/doodle/',
-  WRITERS: '//api.banidb.com/v2/writers/'
+  WRITERS: '//api.banidb.com/v2/writers/',
+  GURBANIBOT: '//fastersemanticsearchapi.sevaa.win/'
 };
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@sttm/web",
-  "version": "1.14.3",
+  "version": "1.15.0",
   "description": "Sevadaars are currently working hard to build a newer version of SikhiToTheMax website using modern web technologies.",
   "main": "index.js",
   "engines": {

diff --git a/server/routes/favouriteShabadsRoutes.js b/server/routes/favouriteShabadsRoutes.js
@@ -15,16 +15,16 @@ const getFavouriteShabadsCallback = async (_req, res, data, connection) => {
 
 const addFavouriteShabadCallback = async (_req, res, data, connection) => {
   try {
-    const {email, shabadId, comment} = data;
+    const {email, shabadId, comment, verseId} = data;
     const row = await connection.query("SELECT id FROM users where email = ?", [email]);
     const user = row[0];
     const favShabad = await connection.query('SELECT * FROM favourite_shabads WHERE shabad_id = ? AND user_id = ?', [shabadId, user.id])
     let rows = [];
-    let q = "INSERT INTO favourite_shabads (comment, shabad_id, user_id) VALUES (?,?,?)";
+    let q = "INSERT INTO favourite_shabads (comment, shabad_id, user_id, verse_id) VALUES (?,?,?,?)";
     if(favShabad[0]) {
       q = "UPDATE favourite_shabads SET comment = ? WHERE (shabad_id = ? AND user_id = ?)"    
     }
-    rows = await connection.query(q, [ comment, shabadId, user.id])
+    rows = await connection.query(q, [ comment, shabadId, user.id, verseId])
     const result = await connection.query("SELECT * from favourite_shabads WHERE id = ?", [rows.insertId])
     res.status(200).json(result[0]);
   }catch(err) {
@@ -60,14 +60,15 @@ const getFavouriteShabads = async (req, res) => {
 const addFavouriteShabad = (req, res) => {
   const shabadId = req.body.shabadId;
   const comment = req.body.comment;
+  const verseId = req.body.verseId;
   const bearerToken = req.headers.authorization;
   const token = bearerToken.substr(7);
   const {email} = jwtVerify(token)
 
   pool.runQuery(
     req, 
     res, 
-    {email, shabadId, comment}, 
+    {email, shabadId, comment, verseId}, 
     addFavouriteShabadCallback
   )
 }

diff --git a/src/js/components/Autocomplete.js b/src/js/components/Autocomplete.js
@@ -7,6 +7,7 @@ import { setMultipleShabads, setMultiViewPanel } from '@/features/actions';
 import Larivaar from '../components/Larivaar';
 import { toSearchURL } from '@/util';
 import { ShabadButtonWrapper } from "./ShabadButtonWrapper";
+import { SEARCH_TYPES } from "@/constants";
 
 class Autocomplete extends Component {
   static propTypes = {
@@ -77,10 +78,10 @@ class Autocomplete extends Component {
   // Closing suggestions on mouse down
   onMouseDown = e => {
     e.stopPropagation();
-    (this.state.showSuggestions && !this.wrapperRef.current.contains(e.target)) &&       
-    this.setState({
-      showSuggestions: false,
-    });    
+    (this.state.showSuggestions && !this.wrapperRef.current.contains(e.target)) &&
+      this.setState({
+        showSuggestions: false,
+      });
   }
 
   componentDidMount() {
@@ -117,7 +118,6 @@ class Autocomplete extends Component {
 
           getSuggestions(userInput, searchOptions)
             .then(suggestions => {
-
               // if any suggestion exists, only then add this as final result item
               if (isShowFullResults && suggestions.length) {
                 suggestions.push({
@@ -168,6 +168,7 @@ class Autocomplete extends Component {
     } = this;
 
     let suggestionsListComponent;
+    const isChatBot = searchOptions.type === SEARCH_TYPES.ASK_A_QUESTION;
 
     if (showSuggestions && value) {
       if (filteredSuggestions.length) {
@@ -218,14 +219,14 @@ class Autocomplete extends Component {
                           {searchOptions.type === 3 ? suggestion.translation : suggestion.pankti}
                         </Larivaar>
                         {searchOptions.type === 3 && (<p className="gurbani-font">{suggestion.pankti}</p>)}
-                      </a>  
+                      </a>
                       {
                         <div className="add-shabad-wrapper">
                           <ShabadButtonWrapper shabad={suggestion} />
                         </div>
-                      }                    
+                      }
                     </>
-                    }
+                  }
                 </li>
               );
             })}
@@ -242,7 +243,7 @@ class Autocomplete extends Component {
 
     return (
       <Fragment>
-        {suggestionsListComponent}
+        {!isChatBot && suggestionsListComponent}
       </Fragment>
     );
   }

diff --git a/src/js/components/FloatingActions/components/FloatingActions.tsx b/src/js/components/FloatingActions/components/FloatingActions.tsx
@@ -48,7 +48,7 @@ export const FloatingActions = (props: Props) => {
             {isShowFullScreen &&
               <div
                 style={lastIconStyles}
-                className="floatingActionsControl hide-tablet">
+                className="floatingActionsControl">
                 <FullScreen />
               </div>}
             {isShowScrollToTop &&

diff --git a/src/js/components/Header.js b/src/js/components/Header.js
@@ -76,12 +76,12 @@ class Header extends React.PureComponent {
 
   onFormSubmit =
     ({ handleSubmit, ...data }) =>
-    (e) => {
-      e.preventDefault();
-      e.stopPropagation();
-      handleSubmit();
-      this.handleFormSubmit(data);
-    };
+      (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        handleSubmit();
+        this.handleFormSubmit(data);
+      };
 
   handleFormSubmit = (data) => {
     this.props.history.push(toSearchURL(data));
@@ -386,18 +386,19 @@ class Header extends React.PureComponent {
                           value={writer}
                           onChange={handleSearchWriterChange}
                           className={[isWriterChanged ? 'selected' : null]}
+                          disabled={type === SEARCH_TYPES.ASK_A_QUESTION}
                         >
                           {writers
                             ?.filter((e) =>
                               source === 'G' || source === 'A'
                                 ? !SOURCE_WRITER_FILTER[source].includes(
-                                    e.writerID
-                                  )
+                                  e.writerID
+                                )
                                 : source !== 'all'
-                                ? SOURCE_WRITER_FILTER[source].includes(
+                                  ? SOURCE_WRITER_FILTER[source].includes(
                                     e.writerID
                                   )
-                                : true
+                                  : true
                             )
                             .map((writer) => (
                               <option
@@ -429,7 +430,7 @@ class Header extends React.PureComponent {
   }
 }
 
-const mapStateToProps = ({}) => ({});
+const mapStateToProps = ({ }) => ({});
 
 const mapDispatchToProps = {
   toggleSettingsPanel,

diff --git a/src/js/components/Modals/AddFavouriteShabadModal.tsx b/src/js/components/Modals/AddFavouriteShabadModal.tsx
@@ -9,14 +9,23 @@ const AddFavouriteShabadModal = () => {
   const dispatch = useDispatch();
   const isModalOpen = useSelector(state => state.isModalOpen)
   const gurbaniVerses = useSelector(state => state.gurbaniVerses);
-  // const verses = gurbaniVerses.map(gurbani => gurbani.verse.unicode);
+  const options = gurbaniVerses.map(gurbani => {
+    return (
+      {
+        label: gurbani.verse.gurmukhi,
+        value: gurbani.verseId,
+      }
+    )
+  });
+
   const shabadId = getShabadId(gurbaniVerses[0]);
-  // const [pankti, setPankti] = useState<string>(verses[0]);
+  const [pankti, setPankti] = useState<string>(options[0].value);
   const [comment, setComment] = useState<string>('');
-  const create = useCreateFavouriteShabad()
+  const create = useCreateFavouriteShabad();
+
   const onSave = (e) => {
     e.preventDefault();
-    create.mutate({ shabadId, comment });
+    create.mutate({ shabadId, comment, verseId: pankti });
     dispatch(setIsModalOpen(false))
   }
 
@@ -29,18 +38,16 @@ const AddFavouriteShabadModal = () => {
         </div>
         <div className='content'>
           <form method="dialog" onSubmit={onSave}>
-            {/* 
-          Release in version..
-          <label className="title">Select a line to save as the title:
-            <select value={pankti} onChange={(e) => setPankti(e.target.value)}>
-              {verses.map((value, idx) =>
-                <option key={`${idx}-${value}`}>
-                  {value}
-                </option>)
-              }
-            </select>
-          </label> 
-          */}
+            <label className="title">Select a line to save as the title:
+              <select className="dropdown" value={pankti} onChange={(e) => setPankti(e.target.value)}>
+                {options.map((option) =>
+                  <option key={option.value} value={option.value}>
+                    {option.label}
+                  </option>)
+                }
+              </select>
+            </label>
+
             <label className='title'>Notes:
               <textarea
                 name="comment"
@@ -50,7 +57,7 @@ const AddFavouriteShabadModal = () => {
                 value={comment}
                 onChange={(e) => setComment(e.target.value)}
                 className="textarea"
-                autoFocus 
+                autoFocus
               />
             </label>
             <div className="save-btn">

diff --git a/src/js/components/SearchForm.js b/src/js/components/SearchForm.js
@@ -97,7 +97,7 @@ export default class SearchForm extends React.PureComponent {
       localStorage.getItem(LOCAL_STORAGE_KEY_FOR_SEARCH_SOURCE) ||
       DEFAULT_SEARCH_SOURCE,
     writer:
-      this.props.defaultWriter || 
+      this.props.defaultWriter ||
       localStorage.getItem(LOCAL_STORAGE_KEY_FOR_SEARCH_WRITER) ||
       DEFAULT_SEARCH_WRITER,
     writers: DEFAULT_SEARCH_WRITERS,
@@ -155,7 +155,7 @@ export default class SearchForm extends React.PureComponent {
     getWriterList()
       .then(writersData => {
         this._setState({ writers: writersData })
-      })    
+      })
   }
 
   selectHighlight = () => {
@@ -345,7 +345,7 @@ export default class SearchForm extends React.PureComponent {
     }
   };
 
-  handleSearchSourceChange = ({target}) => {
+  handleSearchSourceChange = ({ target }) => {
     const source = target.value
     this.setState(
       {
@@ -363,7 +363,7 @@ export default class SearchForm extends React.PureComponent {
         localStorage.setItem(
           LOCAL_STORAGE_KEY_FOR_SEARCH_SOURCE,
           this.state.source
-        );        
+        );
       }
     );
   }
@@ -412,7 +412,7 @@ export default class SearchForm extends React.PureComponent {
     );
   }
 
-  handleSearchWriterChange = ({target}) => {
+  handleSearchWriterChange = ({ target }) => {
     const writer = target.value
     this.setState({
       writer,
@@ -421,16 +421,16 @@ export default class SearchForm extends React.PureComponent {
         this.state.query !== '',
       isWriterChanged: writer !== DEFAULT_SEARCH_WRITER
     },
-    () => {
-      clickEvent({
-        action: ACTIONS.SEARCH_WRITER,
-        label: this.state.writer,
-      });
-      localStorage.setItem(
-        LOCAL_STORAGE_KEY_FOR_SEARCH_WRITER,
-        this.state.writer
-      );
-    })
+      () => {
+        clickEvent({
+          action: ACTIONS.SEARCH_WRITER,
+          label: this.state.writer,
+        });
+        localStorage.setItem(
+          LOCAL_STORAGE_KEY_FOR_SEARCH_WRITER,
+          this.state.writer
+        );
+      })
   }
 
   handleReset = (e) => {
@@ -446,10 +446,10 @@ export default class SearchForm extends React.PureComponent {
         this.props.submitOnChangeOf.includes('writer') &&
         this.state.query !== ''
     },
-    () => {
-      localStorage.setItem(LOCAL_STORAGE_KEY_FOR_SEARCH_SOURCE, this.state.source);
-      localStorage.removeItem(LOCAL_STORAGE_KEY_FOR_SEARCH_WRITER);
-    })
+      () => {
+        localStorage.setItem(LOCAL_STORAGE_KEY_FOR_SEARCH_SOURCE, this.state.source);
+        localStorage.removeItem(LOCAL_STORAGE_KEY_FOR_SEARCH_WRITER);
+      })
   }
 
   handleSubmit = () => {

diff --git a/src/js/components/SearchResults/SearchResults.js b/src/js/components/SearchResults/SearchResults.js
@@ -30,20 +30,33 @@ export default class SearchResults extends React.PureComponent {
       'main-letter-search': type === SEARCH_TYPES.MAIN_LETTERS
     });
 
+
+    const warning = type === SEARCH_TYPES['ASK_A_QUESTION'] && (
+      <div className='warning-box'>
+        <h4>⚠ This is an experimental feature.</h4>
+        <p>Please <a href="https://support.khalisfoundation.org/support/tickets/new" target="blank">
+          <u>get in touch</u></a> with us if you have any concerns or feedback.
+        </p>
+      </div>
+    );
+
     return (
-      <ul className={searchResultsClassName}>
-        {
-          shabads.map(shabad => {
-            return (
-              <SearchResult
-                key={getVerseId(shabad)}
-                type={type}
-                shabad={shabad}
-                {...props} />
-            );  
-          })
-        }
-      </ul>
+      <>
+        {warning}
+        <ul className={searchResultsClassName}>
+          {
+            shabads.map(shabad => {
+              return (
+                <SearchResult
+                  key={getVerseId(shabad)}
+                  type={type}
+                  shabad={shabad}
+                  {...props} />
+              );
+            })
+          }
+        </ul>
+      </>
     );
   }
 }
diff --git a/src/js/constants/misc.ts b/src/js/constants/misc.ts
@@ -1,6 +1,9 @@
 import { SOURCES, SOURCES_WITH_ANG, TYPES as _TYPES } from '@sttm/banidb';
 import { SEARCH_TYPES } from './search-types';
 
+// TODO: Need to move this to @sttm/banidb module
+_TYPES.push('Ask a Question (English)');
+
 export { SOURCES, SOURCES_WITH_ANG };
 
 export const BANI_LENGTH_COLS = {