imio.smartweb.core 1.2.12__py3-none-any.whl → 1.2.19__py3-none-any.whl

imio/smartweb/core/webcomponents/src/components/News/News.jsx

@@ -1,8 +1,8 @@
 import React, { useEffect, useState } from "react";
-import { HashRouter as Router, Switch, Route } from "react-router-dom";
+import { BrowserRouter as Router, Switch, Route } from "react-router-dom";
 import Filters from "./Filters/Filter";
-import ContactContent from "./ContactContent/ContactContent";
-import ContactList from "./ContactList/ContactList";
+import NewsContent from "./NewsContent/NewsContent";
+import NewsList from "./NewsList/NewsList";
 import useAxios from "../../hooks/useAxios";
 import "./News.scss";
 import useFilterQuery from "../../hooks/useFilterQuery";
@@ -11,7 +11,7 @@ import translation from '../../utils/translation';
 
 export default function News(props) {
     return (
-        <Router>
+        <Router basename={props.viewPath}>
             <Provider language={props.currentLanguage} translation={translation}>
                 <NewsView
                     queryFilterUrl={props.queryFilterUrl}
@@ -29,8 +29,8 @@ const NewsView = (props) => {
         { b_start: 0, fullobjects: 1 },
         queryString.parse(useFilterQuery().toString())
     );
-    const [contactArray, setcontactArray] = useState([]);
-    const [contactNumber, setcontactNumber] = useState([]);
+    const [itemsArray, setItemsArray] = useState([]);
+    const [itemsNumber, setItemsNumber] = useState([]);
     const [clickId, setClickId] = useState(null);
     const [filters, setFilters] = useState(parsed);
     const [batchStart, setBatchStart] = useState(0);
@@ -53,11 +53,11 @@ const NewsView = (props) => {
     useEffect(() => {
         if (response !== null) {
             if (isMore) {
-                setcontactArray((contactArray) => [...contactArray, ...response.items]);
+                setItemsArray((itemsArray) => [...itemsArray, ...response.items]);
             } else {
-                setcontactArray(response.items);
+                setItemsArray(response.items);
             }
-            setcontactNumber(response.items_total);
+            setItemsNumber(response.items_total);
         }
     }, [response]);
 
@@ -89,8 +89,8 @@ const NewsView = (props) => {
     }, [batchStart]);
     // coditional list render
     let listRender;
-    if (contactArray && contactArray.length > 0) {
-        listRender = <ContactList onChange={clickID} contactArray={contactArray} />;
+    if (itemsArray && itemsArray.length > 0) {
+        listRender = <NewsList onChange={clickID} itemsArray={itemsArray} />;
     } else if (!isLoading) {
         listRender = <p><Translate text="Aucune actualité n'a été trouvée" /></p>;
     }
@@ -99,18 +99,10 @@ const NewsView = (props) => {
 
     return (
         <div>
-            <Router>
                 <div className="r-wrapper r-actu-wrapper">
                     <div className="r-result r-annuaire-result">
                         <Switch>
-                            <Route path={"/:name"}>
-                                <ContactContent
-                                    onChange={clickID}
-                                    onReturn={filtersChange}
-                                    queryUrl={props.queryUrl}
-                                />
-                            </Route>
-                            <Route exact path="*">
+                            <Route exact path="/">
                                 <div className="r-result-filter actu-result-filter">
                                     <Filters
                                         url={props.queryFilterUrl}
@@ -124,10 +116,10 @@ const NewsView = (props) => {
                                             </div>
                                         )
                                     }
-                                    {contactNumber > 0 ? (
+                                    {itemsNumber > 0 ? (
                                         <p className="r-results-numbers">
-                                            <span>{contactNumber}</span>{" "}
-                                            {contactNumber > 1
+                                            <span>{itemsNumber}</span>{" "}
+                                            {itemsNumber > 1
                                                 ? <Translate text='Actualités trouvées' />
                                                 : <Translate text='Actualité trouvée' />}
                                         </p>
@@ -137,7 +129,7 @@ const NewsView = (props) => {
                                 </div>
                                 <div>{listRender}</div>
                                 <div className="r-load-more">
-                                    {contactNumber - props.batchSize > batchStart ? (
+                                    {itemsNumber - props.batchSize > batchStart ? (
                                         <div>
                                             <span className="no-more-result">
                                                 {isLoading ? divLoader : ""}
@@ -153,10 +145,16 @@ const NewsView = (props) => {
                                     )}
                                 </div>
                             </Route>
+                            <Route path={"/:name"}>
+                                <NewsContent
+                                    onChange={clickID}
+                                    onReturn={filtersChange}
+                                    queryUrl={props.queryUrl}
+                                />
+                            </Route>
                         </Switch>
                     </div>
                 </div>
-            </Router>
         </div>
     );
 };

imio/smartweb/core/webcomponents/src/components/News/News.scss

@@ -38,7 +38,7 @@
 // content
 
 .r-content-img {
-  padding-bottom: 56.25%;
+  padding-bottom: 60%;
 }
 .new-content {
   max-width: 700px;
@@ -102,15 +102,13 @@
 }
 .r-actu-wrapper {
   .r-item-img {
-    height: 183px;
-    flex: 0 0 247px;
+    width: 100%;
+    aspect-ratio: 1.674107142857143;
     background-position: top;
     background-size: cover;
     background-repeat: no-repeat;
     @media screen and (min-width:775px) {
       width: 323px;
-      height: 220px;
-      flex: 0 0 323px;
     }
   }
 }

imio/smartweb/core/webcomponents/src/components/News/{ContactCard/ContactCard.jsx → NewsCard/NewsCard.jsx}

@@ -1,17 +1,16 @@
 import React, { useEffect, useState } from "react";
 import moment from "moment";
 import Moment from "react-moment";
-import { Link } from "react-router-dom";
 import removeAccents from "remove-accents";
 import ReactMarkdown from 'react-markdown';
 
-const ContactCard = ({ contactItem }) => {
+const NewsCard = ({ item }) => {
     const [limitDescription, setLimitDescription] = useState();
     const numberLimit = 150;
-    const title = contactItem.title && contactItem.title;
-    const description = contactItem.description && contactItem.description;
-    const category = contactItem.taxonomy_contact_category
-        ? contactItem.taxonomy_contact_category[0].title
+    const title = item.title && item.title;
+    const description = item.description && item.description;
+    const category = item.taxonomy_contact_category
+        ? item.taxonomy_contact_category[0].title
         : "";
     useEffect(() => {
         if (description.length >= numberLimit) {
@@ -19,17 +18,17 @@ const ContactCard = ({ contactItem }) => {
         } else {
             setLimitDescription(description);
         }
-    }, [contactItem]);
+    }, [item]);
     moment.locale('fr')
-    const created = moment(contactItem.created).startOf('minute').fromNow();
-    const lastModified = moment(contactItem.modified).startOf('minute').fromNow();
+    const created = moment(item.created).startOf('minute').fromNow();
+    const lastModified = moment(item.modified).startOf('minute').fromNow();
     return (
         <div className="r-list-item">
             <div
-                className={contactItem.image_vignette_scale?"r-item-img":"r-item-img r-item-img-placeholder"}
+                className={item.image_vignette_scale?"r-item-img":"r-item-img r-item-img-placeholder"}
                 style={{
-                    backgroundImage: contactItem.image_vignette_scale
-                        ? "url(" + contactItem.image_vignette_scale + ")"
+                    backgroundImage: item.image_vignette_scale
+                        ? "url(" + item.image_vignette_scale + ")"
                         : "",
                 }}
             />
@@ -40,19 +39,7 @@ const ContactCard = ({ contactItem }) => {
                     <ReactMarkdown className="r-item-description">{limitDescription}</ReactMarkdown> 
                     : ""
                 }
-                <Link
-                    className="r-item-read-more"
-                    style={{ textDecoration: "none" }}
-                    to={{
-                        pathname: removeAccents(
-                            contactItem.title.replace(/\s/g, "-").toLowerCase()
-                        ),
-                        search: `?u=${contactItem.UID}`,
-                        state: {
-                            idItem: contactItem.UID,
-                        },
-                    }}
-                >
+                <div className="r-item-read-more" style={{ textDecoration: "none" }}>
                     {
                         created === lastModified ?
                         (
@@ -68,11 +55,11 @@ const ContactCard = ({ contactItem }) => {
                         </div>
                         )
                     }
-                </Link>
+                </div>
             </div>
             <div className="r-item-arrow-more"></div>
         </div>
     );
 };
 
-export default ContactCard;
+export default NewsCard;

imio/smartweb/core/webcomponents/src/components/News/{ContactContent/ContactContent.jsx → NewsContent/NewsContent.jsx}

@@ -14,9 +14,9 @@ const ContactContent = ({ queryUrl, onChange }) => {
     const parsed = queryString.parse(useFilterQuery().toString());
     const parsed2 = { ...parsed, UID: parsed["u"], fullobjects: 1 };
     const [params, setParams] = useState(parsed2);
-    const [contactItem, setcontactItem] = useState({});
-    const [files, setFiles] = useState(0);
-    const [gallery, setGallery] = useState(0);
+    const [item, setitem] = useState({});
+    const [files, setFiles] = useState();
+    const [gallery, setGallery] = useState();
     const { response, error, isLoading } = useAxios(
         {
             method: "get",
@@ -31,26 +31,26 @@ const ContactContent = ({ queryUrl, onChange }) => {
     );
     useEffect(() => {
         if (response !== null) {
-            setcontactItem(response.items[0]);
+            setitem(response.items[0]);
         }
         window.scrollTo(0, 0);
     }, [response]);
 
 	/// use to set file and gallery items
 	useEffect(() => {
-        if (contactItem.items && contactItem.items.length > 0) {
-            setFiles(contactItem.items.filter(files => files['@type'] === 'File'));
-            setGallery(contactItem.items.filter(files => files['@type'] === 'Image'));
+        if (item.items && item.items.length > 0) {
+            setFiles(item.items.filter(files => files['@type'] === 'File'));
+            setGallery(item.items.filter(files => files['@type'] === 'Image'));
         }
-    }, [contactItem]);
+    }, [item]);
 
     function handleClick() {
         history.push("./");
         onChange(null);
     }
 	moment.locale('fr')
-    const created = moment(contactItem.created).startOf('minute').fromNow();
-    const lastModified = moment(contactItem.modified).startOf('minute').fromNow();
+    const created = moment(item.created).startOf('minute').fromNow();
+    const lastModified = moment(item.modified).startOf('minute').fromNow();
 
     return (
         <div className="new-content r-content">
@@ -59,17 +59,17 @@ const ContactContent = ({ queryUrl, onChange }) => {
             </button>
             <article>
                 <header>
-                    <h2 className="r-content-title">{contactItem.title}</h2>
+                    <h2 className="r-content-title">{item.title}</h2>
                     <div className="r-content-description">
-					    <ReactMarkdown>{contactItem.description}</ReactMarkdown>
+					    <ReactMarkdown>{item.description}</ReactMarkdown>
 				    </div>
                 </header>
                 <figure>
                     <div
                         className="r-content-img"
                         style={{
-                            backgroundImage: contactItem.image_affiche_scale
-                                ? "url(" + contactItem.image_affiche_scale + ")"
+                            backgroundImage: item.image_affiche_scale
+                                ? "url(" + item.image_affiche_scale + ")"
                                 : "",
                         }}
                     />
@@ -113,8 +113,8 @@ const ContactContent = ({ queryUrl, onChange }) => {
 							</div>
 						</div>
 						{/* link  */}
-						{contactItem.site_url === null &&
-							contactItem.video_url === null ? (
+						{item.site_url === null &&
+							item.video_url === null ? (
 							""
 						) : (
 							<div className="r-content-news-info-link">
@@ -127,36 +127,36 @@ const ContactContent = ({ queryUrl, onChange }) => {
 									</svg>
 								</div>
 								<div className="dpinlb">
-									{contactItem.site_url === null ? (
+									{item.site_url === null ? (
 										""
 									) : (
 										<div className="r-content-news-info-event_link">
-											<a href={contactItem.site_url}>{contactItem.site_url}</a>
+											<a href={item.site_url}>{item.site_url}</a>
 										</div>
 									)}
-									{contactItem.video_url === null ? (
+									{item.video_url === null ? (
 										""
 									) : (
 										<div className="r-content-news-info--video">
-											<a href={contactItem.video_url}>Lien vers la vidéo</a>
+											<a href={item.video_url}>Lien vers la vidéo</a>
 										</div>
 									)}
 								</div>
 							</div>
 						)}
 						{/* Social */}
-						{contactItem.facebook === null &&
-							contactItem.instagram === null &&
-							contactItem.twitter === null ? (
+						{item.facebook === null &&
+							item.instagram === null &&
+							item.twitter === null ? (
 							""
 						) : (
 							<div className="r-content-news-info-social">
 								<ul>
-									{!contactItem.facebook ? (
+									{!item.facebook ? (
 										""
 									) : (
 										<li>
-											<a href={contactItem.facebook} target="_blank">
+											<a href={item.facebook} target="_blank">
 												<svg
 													xmlns="http://www.w3.org/2000/svg"
 													height="800"
@@ -175,11 +175,11 @@ const ContactContent = ({ queryUrl, onChange }) => {
 											</a>
 										</li>
 									)}
-									{!contactItem.instagram ? (
+									{!item.instagram ? (
 										""
 									) : (
 										<li>
-											<a href={contactItem.instagram} target="_blank">
+											<a href={item.instagram} target="_blank">
 												<svg
 													xmlns="http://www.w3.org/2000/svg"
 													height="800"
@@ -194,11 +194,11 @@ const ContactContent = ({ queryUrl, onChange }) => {
 											</a>
 										</li>
 									)}
-									{!contactItem.twitter ? (
+									{!item.twitter ? (
 										""
 									) : (
 										<li>
-											<a href={contactItem.twitter} target="_blank">
+											<a href={item.twitter} target="_blank">
 												<svg
 													xmlns="http://www.w3.org/2000/svg"
 													height="800"
@@ -221,38 +221,35 @@ const ContactContent = ({ queryUrl, onChange }) => {
                 <div
                     className="r-content-text"
                     dangerouslySetInnerHTML={{
-                        __html: contactItem.text && contactItem.text.data,
+                        __html: item.text && item.text.data,
                     }}
                 ></div>
 				{/* add files to download */}
 				{
-					files ? (
+					files &&
 						<div className="r-content-files">
-							{files.map((file) => (
+							{files.map((file, i) => (
 								<div className="r-content-file">
-									<a href={file.targetUrl} className="r-content-file-link" rel="nofollow">
+									<a key={i} href={file.targetUrl} className="r-content-file-link" rel="nofollow">
 										<span className="r-content-file-title">{file.title}</span>
-										{/* <span className="r-content-file-size">{file.file.size}</span> */}
 										<span className="r-content-file-icon"><svg width="21" height="21" viewBox="0 0 24 24" fill="none" stroke="#8899a4" stroke-width="2" stroke-linecap="square" stroke-linejoin="arcs"><path d="M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 9l-5 5-5-5M12 12.8V2.5"></path></svg> </span>
 									</a>
 								</div>
 							))}
 						</div>
-					) : ("")
 				}
 				{/* add gallery */}
 				{
-					gallery ? (
+					gallery &&
 					<div className="r-content-gallery">
 						<div class="spotlight-group flexbin r-content-gallery">
-							{gallery.map((image) => (
-								<a class="spotlight" href={image.image_full_scale} >
-									<img src={image.image_preview_scale} />
+							{gallery.map((image,i) => (
+								<a key={i} class="spotlight" href={image.image_extralarge_scale} >
+									<img src={image.image_vignette_scale} />
 								</a>
 							))}
 						</div>
 					</div>
-					) : ("")
 				}
             </article>
         </div>

imio/smartweb/core/webcomponents/src/components/News/{ContactList/ContactList.jsx → NewsList/NewsList.jsx}

@@ -1,32 +1,32 @@
-import ContactCard from "../ContactCard/ContactCard";
+import NewsCard from "../NewsCard/NewsCard";
 import { Link } from "react-router-dom";
 import React from "react";
 import removeAccents from "remove-accents";
-const ContactList = ({ contactArray, onChange, parentCallback }) => {
+const NewsList = ({ itemsArray, onChange, parentCallback }) => {
     function handleClick(event) {
         onChange(event);
     }
     return (
         <React.Fragment>
             <ul className="r-result-list actu-result-list">
-                {contactArray.map((contactItem, i) => (
+                {itemsArray.map((item, i) => (
                     <li
                         key={i}
                         className="r-list-item-group"
-                        onClick={() => handleClick(contactItem.UID)}
+                        onClick={() => handleClick(item.UID)}
                     >
                         <Link
                             className="r-news-list-item-link"
                             style={{ textDecoration: "none" }}
                             to={{
-                                pathname: removeAccents(contactItem.title).replace(/[^a-zA-Z ]/g, "").replace(/\s/g, "-").toLowerCase(),
-                                search: `?u=${contactItem.UID}`,
+                                pathname: removeAccents(item.title).replace(/[^a-zA-Z ]/g, "").replace(/\s/g, "-").toLowerCase(),
+                                search: `?u=${item.UID}`,
                                 state: {
-                                    idItem: contactItem.UID,
+                                    idItem: item.UID,
                                 },
                             }}
                         >
-                        <ContactCard contactItem={contactItem} key={contactItem.created} />
+                        <NewsCard item={item} key={item.created} />
                         </Link>
                     </li>
                 ))}
@@ -34,4 +34,4 @@ const ContactList = ({ contactArray, onChange, parentCallback }) => {
         </React.Fragment>
     );
 };
-export default ContactList;
+export default NewsList;

imio/smartweb/core/webcomponents/src/components/Search/ContactResult/ContactResult.jsx

@@ -33,14 +33,14 @@ const ContactResult = (props) => {
                 </p>
             </div>
             <ul className="r-search-list">
-                {resultArray.map((contactItem, i) => (
+                {resultArray.map((item, i) => (
                     <li key={i} className="r-search-item">
-                        <a href={contactItem["_url"]}>
+                        <a href={item["_url"]}>
                             <div className="r-search-img">
                             {
-                                contactItem.has_leadimage[0] ? (
+                                item.has_leadimage[0] ? (
                                     <div className="r-search-img" style={{
-                                        backgroundImage:"url(" + contactItem.image_url +")"
+                                        backgroundImage:"url(" + item.image_url +")"
                                     }}></div>
                                 ):(
                                     <div className="r-search-img no-search-item-img"></div>
@@ -50,7 +50,7 @@ const ContactResult = (props) => {
                             <Highlighter
                                 highlightClassName="r-search-highlighter"
                                 searchWords={[props.urlParams.SearchableText]}
-                                textToHighlight={contactItem.title}
+                                textToHighlight={item.title}
                             />
                         </a>
                     </li>

imio/smartweb/core/webcomponents/src/components/Search/EventsResult/EventsResult.jsx

@@ -33,14 +33,14 @@ const EventsResult = (props) => {
                 </p>
             </div>
             <ul className="r-search-list">
-                {resultArray.map((contactItem, i) => (
+                {resultArray.map((item, i) => (
                     <li key={i} className="r-search-item">
-                        <a href={contactItem["_url"]}>
+                        <a href={item["_url"]}>
                             <div className="r-search-img">
                             {
-                                contactItem.has_leadimage[0] ? (
+                                item.has_leadimage[0] ? (
                                     <div className="r-search-img" style={{
-                                        backgroundImage:"url(" + contactItem.image_url +")"
+                                        backgroundImage:"url(" + item.image_url +")"
                                     }}></div>
                                 ):(
                                     <div className="r-search-img no-search-item-img"></div>
@@ -50,7 +50,7 @@ const EventsResult = (props) => {
                             <Highlighter
                                 highlightClassName="r-search-highlighter"
                                 searchWords={[props.urlParams.SearchableText]}
-                                textToHighlight={contactItem.title}
+                                textToHighlight={item.title}
                             />
                         </a>
                     </li>

imio/smartweb/core/webcomponents/src/components/Search/NewsResult/NewsResult.jsx

@@ -33,14 +33,14 @@ const NewsResult = (props) => {
                 </p>
             </div>
             <ul className="r-search-list">
-                {resultArray.map((contactItem, i) => (
+                {resultArray.map((item, i) => (
                     <li key={i} className="r-search-item">
-                        <a href={contactItem["_url"]}>
+                        <a href={item["_url"]}>
                             <div className="r-search-img">
                                 {
-                                    contactItem.has_leadimage[0] ? (
+                                    item.has_leadimage[0] ? (
                                         <div className="r-search-img" style={{
-                                            backgroundImage:"url(" + contactItem.image_url +")"
+                                            backgroundImage:"url(" + item.image_url +")"
                                         }}></div>
                                     ):(
                                         <div className="r-search-img no-search-item-img"></div>
@@ -50,7 +50,7 @@ const NewsResult = (props) => {
                             <Highlighter
                                 highlightClassName="r-search-highlighter"
                                 searchWords={[props.urlParams.SearchableText]}
-                                textToHighlight={contactItem.title}
+                                textToHighlight={item.title}
                             />
                         </a>
                     </li>

imio/smartweb/core/webcomponents/src/components/Search/WebResult/WebResult.jsx

@@ -33,13 +33,13 @@ const WebResult = (props) => {
                 </p>
             </div>
             <ul className="r-search-list">
-                {resultArray.map((contactItem, i) => (
+                {resultArray.map((item, i) => (
                     <li key={i} className="r-search-item">
-                        <a href={contactItem["@id"]}>
+                        <a href={item["@id"]}>
                             <Highlighter
                                 highlightClassName="r-search-highlighter"
                                 searchWords={[props.urlParams.SearchableText]}
-                                textToHighlight={contactItem.title}
+                                textToHighlight={item.title}
                             />
                         </a>
                     </li>