Merge pull request #177 from airbnb/av376-patch-1

Update index.html
airbnb · Aug 1, 2024 · a16342e · a16342e
2 parents 1f2548b + 1665d05
commit a16342e
Showing 1 changed file with 1 addition and 1 deletion.
diff --git a/templates/image-grid/listing-categories/ai-first-pass/index.html b/templates/image-grid/listing-categories/ai-first-pass/index.html
@@ -121,7 +121,7 @@
 `,Xm=se(ud)`
   margin-top: 20px;
   margin-bottom: 20px;
-`,Zm=()=>{const[e,t]=te.useState(void 0),[n,r]=te.useState(void 0),[l,o]=te.useState({}),[i,u]=te.useState({}),[s,c]=te.useState({}),[m,h]=te.useState({}),[p,g]=te.useState(!1),y=te.useRef(p);y.current=p;const[k,z]=te.useState(!1),f=te.useRef(null);te.useEffect(()=>{const T=A=>{A.data.type==="LISTINGS"&&(t(A.data.payload),z(!0))};return window.addEventListener("message",T),()=>{window.removeEventListener("message",T)}},[]),te.useEffect(()=>{window.LbHtmlApi.data.features.classifications.subscribe(T=>{var Z,C;if(y.current)return;const A=JSON.parse(((Z=T.find(N=>N.name===xa))==null?void 0:Z.value)||"{}");A&&o(A);const le=JSON.parse(((C=T.find(N=>N.name===Ea))==null?void 0:C.value)||"{}");le&&u(le),g(!0)})},[]);const a=n?l[n.listingId]:null,d=!!ol.find(T=>T.label===(e==null?void 0:e.qualityTier)),v=a||(d?e==null?void 0:e.qualityTier:"default"),x=p&&k,E=Mm(x),w=x&&E!==x;if(te.useEffect(()=>{if(!w)return;const T=!!ol.find(Z=>Z.label===(e==null?void 0:e.qualityTier)),A=e.gridImages.reduce((Z,C)=>(Z[C.listingId]=l[C.listingId]?l[C.listingId]:T?e.qualityTier:"default",Z),{}),le=e.gridImages.reduce((Z,C)=>(Z[C.listingId]=i[C.listingId]?i[C.listingId]:C.photoId,Z),{});c(A),o(A),h(le),u(le)},[w,e,l,i]),!e)return null;const P=T=>{window.LbHtmlApi.actions.updateFreeText(xa,JSON.stringify(T))},F=T=>{const A={...l,[T]:s[T]};o(A),P(A)},R=T=>{window.LbHtmlApi.actions.updateFreeText(Ea,JSON.stringify({...T}))},ve=T=>{const A={...i,[T]:m[T]};u(A),R(A)},rt=T=>l[T]!==e.qualityTier,lt=T=>{const A=e.gridImages.find(le=>T===le.listingId);return A?i[T]!==A.photoId:!1};return L.jsxs(Fm,{children:[n?L.jsxs(Am,{children:[L.jsx(bn,{title:"Photo ID:",children:i[n.listingId]||n.photoId||"<none>"}),L.jsx(Gm,{}),L.jsx(bn,{title:"Quality:",children:L.jsxs("select",{style:{width:"100%"},ref:f,value:v,onChange:T=>{const A={...l,[n.listingId]:T.target.value};o(A),P(A)},children:[ol.map(T=>L.jsx("option",{value:T.value,children:T.label},T.value)),L.jsx("option",{disabled:!0,selected:!0,value:"default",children:"-- select an option --"})]})}),L.jsx(Jm,{children:L.jsx(qm,{onClick:()=>{ve(n.listingId),F(n.listingId)},children:"Reset"})})]}):null,L.jsxs(Um,{children:[L.jsx(Hm,{children:`${e.attribute} - ${e.qualityTier}`}),n?L.jsxs(Vm,{children:[L.jsx(il,{children:L.jsx(bn,{title:"Listing ID:",children:n.listingId})}),L.jsx(il,{children:L.jsx(bn,{title:"Property type:",children:n.propertyType})}),L.jsx(il,{children:L.jsx(bn,{title:"Room type:",children:n.roomType})}),L.jsx(il,{children:L.jsx("a",{id:"pdp-link",href:`https://www.airbnb.com/rooms/${n.listingId}`,children:"PDP Link"})})]}):null,L.jsx(Qm,{children:e.gridImages.map(T=>{var C,N;const A=i[T.listingId],le=(C=ol.find(I=>I.value===l[T.listingId]))==null?void 0:C.color,Z=(n==null?void 0:n.listingId)===T.listingId||rt(T.listingId)?le:lt(T.listingId)?"pink":void 0;return L.jsx(Wm,{url:A?((N=T.listingImages.find(I=>I.photoId===A))==null?void 0:N.photoLink)||"":T.listingImages[0].photoLink,onClick:()=>{r(T)},borderColor:Z},T.listingId)})})]}),n?L.jsxs(Bm,{children:[L.jsx(ud,{children:"Listing Info"}),L.jsx(Jo,{title:"Title",value:n.listingTitle}),L.jsx(Jo,{title:"Category Fit Rationale",value:n.categoryFitRationale}),L.jsx(Jo,{title:"Description",value:n.listingDescription}),L.jsx(qi,{title:"Location",value:n.listingLocation}),L.jsx(qi,{title:"Where you'll be",value:""}),L.jsx("iframe",{style:{width:"450px",height:"450px",border:0},src:`https://maps.google.com/maps?q=${n.lat},${n.lng}&z=14&output=embed`}),L.jsx(Xm,{children:"Other pictures"}),n.listingImages.map(T=>L.jsxs(L.Fragment,{children:[L.jsx(Jo,{title:"Photo ID",value:T.photoId}),L.jsx(Km,{onClick:()=>{if(i[n.listingId]===T.photoId)return;const le={...i,[n.listingId]:T.photoId};u(le),R(le);const Z=d?e.qualityTier:"default",C={...l,[n.listingId]:Z};o(C),P(C)},children:L.jsx("img",{src:T.photoLink,alt:""})},T.photoId)]}))]}):null]})},Jm=se.div`
+`,Zm=()=>{const[e,t]=te.useState(void 0),[n,r]=te.useState(void 0),[l,o]=te.useState({}),[i,u]=te.useState({}),[s,c]=te.useState({}),[m,h]=te.useState({}),[p,g]=te.useState(!1),y=te.useRef(p);y.current=p;const[k,z]=te.useState(!1),f=te.useRef(null);te.useEffect(()=>{const T=A=>{A.data.type==="LISTINGS"&&(t(A.data.payload),z(!0))};return window.addEventListener("message",T),()=>{window.removeEventListener("message",T)}},[]),te.useEffect(()=>{window.LbHtmlApi.data.features.classifications.subscribe(T=>{var Z,C;if(y.current)return;const A=JSON.parse(((Z=T.find(N=>N.name===xa))==null?void 0:Z.value)||"{}");A&&o(A);const le=JSON.parse(((C=T.find(N=>N.name===Ea))==null?void 0:C.value)||"{}");le&&u(le),g(!0)})},[]);const a=n?l[n.listingId]:null,d=!!ol.find(T=>T.label===(e==null?void 0:e.qualityTier)),v=a||(d?e==null?void 0:e.qualityTier:"default"),x=p&&k,E=Mm(x),w=x&&E!==x;if(te.useEffect(()=>{if(!w)return;const T=!!ol.find(Z=>Z.label===(e==null?void 0:e.qualityTier)),A=e.gridImages.reduce((Z,C)=>(Z[C.listingId]=l[C.listingId]?l[C.listingId]:T?e.qualityTier:"default",Z),{}),le=e.gridImages.reduce((Z,C)=>(Z[C.listingId]=i[C.listingId]?i[C.listingId]:C.photoId,Z),{});c(A),o(A),h(le),u(le)},[w,e,l,i]),!e)return null;const P=T=>{window.LbHtmlApi.actions.updateFreeText(xa,JSON.stringify(T))},F=T=>{const A={...l,[T]:s[T]};o(A),P(A)},R=T=>{window.LbHtmlApi.actions.updateFreeText(Ea,JSON.stringify({...T}))},ve=T=>{const A={...i,[T]:m[T]};u(A),R(A)},rt=T=>l[T]!==e.qualityTier,lt=T=>{const A=e.gridImages.find(le=>T===le.listingId);return A?i[T]!==A.photoId:!1};return L.jsxs(Fm,{children:[n?L.jsxs(Am,{children:[L.jsx(bn,{title:"Photo ID:",children:i[n.listingId]||n.photoId||"<none>"}),L.jsx(Gm,{}),L.jsx(bn,{title:"Quality:",children:L.jsxs("select",{style:{width:"100%"},ref:f,value:v,onChange:T=>{const A={...l,[n.listingId]:T.target.value};o(A),P(A)},children:[ol.map(T=>L.jsx("option",{value:T.value,children:T.label},T.value)),L.jsx("option",{disabled:!0,selected:!0,value:"default",children:"-- select an option --"})]})}),L.jsx(Jm,{children:L.jsx(qm,{onClick:()=>{ve(n.listingId),F(n.listingId)},children:"Reset"})})]}):null,L.jsxs(Um,{children:[L.jsx(Hm,{children:`${e.attribute} - ${e.qualityTier}`}),n?L.jsxs(Vm,{children:[L.jsx(il,{children:L.jsx(bn,{title:"Listing ID:",children:n.listingId})}),L.jsx(il,{children:L.jsx(bn,{title:"Property type:",children:n.propertyType})}),L.jsx(il,{children:L.jsx(bn,{title:"Room type:",children:n.roomType})}),L.jsx(il,{children:L.jsx("a",{id:"pdp-link",href:`https://www.airbnb.com/rooms/${n.listingId}`,children:"PDP Link"})})]}):null,L.jsx(Qm,{children:e.gridImages.map(T=>{var C,N;const A=i[T.listingId],le=(C=ol.find(I=>I.value===l[T.listingId]))==null?void 0:C.color,Z=(n==null?void 0:n.listingId)===T.listingId||rt(T.listingId)?le:lt(T.listingId)?"pink":void 0;return L.jsx(Wm,{url:A?((N=T.listingImages.find(I=>I.photoId===A))==null?void 0:N.photoLink)||"":T.listingImages[0].photoLink,onClick:()=>{r(T)},borderColor:Z},T.listingId)})})]}),n?L.jsxs(Bm,{children:[L.jsx(ud,{children:"Listing Info"}),L.jsx(Jo,{title:"Title",value:n.listingTitle}),L.jsx(Jo,{title:"AI category fit",value:n.aiCategoryFit}),L.jsx(Jo,{title:"AI category fit rationale",value:n.aiCategoryFitRationale}),L.jsx(Jo,{title:"AI category photo rationale",value:n.aiCategoryPhotoRationale}),L.jsx(Jo,{title:"AI confidence score",value:n.aiConfidenceScore}),L.jsx(Jo,{title:"Description",value:n.listingDescription}),L.jsx(qi,{title:"Location",value:n.listingLocation}),L.jsx(qi,{title:"Where you'll be",value:""}),L.jsx("iframe",{style:{width:"450px",height:"450px",border:0},src:`https://maps.google.com/maps?q=${n.lat},${n.lng}&z=14&output=embed`}),L.jsx(Xm,{children:"Other pictures"}),n.listingImages.map(T=>L.jsxs(L.Fragment,{children:[L.jsx(Jo,{title:"Photo ID",value:T.photoId}),L.jsx(Km,{onClick:()=>{if(i[n.listingId]===T.photoId)return;const le={...i,[n.listingId]:T.photoId};u(le),R(le);const Z=d?e.qualityTier:"default",C={...l,[n.listingId]:Z};o(C),P(C)},children:L.jsx("img",{src:T.photoLink,alt:""})},T.photoId)]}))]}):null]})},Jm=se.div`
   padding-top: 8px;
   display: flex;
   justify-content: flex-end;