(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[405],{78581:function(e,t,r){(window.__NEXT_P=window.__NEXT_P||[]).push(["/",function(){return r(47468)}])},47468:function(e,t,r){"use strict";r.r(t),r.d(t,{default:function(){return k}});var s=r(85893),n=r(9008),a=r(67294),c=r(25675),l=r(63801),i=r(63153);var o=function(){return(0,s.jsx)("div",{className:"shadow-sm border-b bg-white sticky top-0 z-50",children:(0,s.jsxs)("div",{className:"flex justify-between max-w-6xl mx-5 lg:mx-auto",children:[(0,s.jsx)("div",{className:"relative hidden lg:inline-grid w-24 cursor-pointer",children:(0,s.jsx)(c.default,{src:"https://links.papareact.com/ocw",layout:"fill",objectFit:"contain"})}),(0,s.jsx)("div",{className:"relative w-10 lg:hidden flex-shrink-0",children:(0,s.jsx)(c.default,{src:"https://links.papareact.com/jjm",layout:"fill",objectFit:"contain"})}),(0,s.jsx)("div",{className:"max-w-xs",children:(0,s.jsxs)("div",{className:"relative mt-1 p-3 rounded-md",children:[(0,s.jsx)("div",{className:"absolute inset-y-0 pl-3 flex items-center pointer-events-none",children:(0,s.jsx)(l.W1M,{className:"h-5 w-5 text-gray-500"})}),(0,s.jsx)("input",{className:"bg-gray-50 block w-full pl-10 sm:text-sm border-gray-300 focus:ring-black focus:border-black rounded-md",type:"text",placeholder:"Search"})]})}),(0,s.jsxs)("div",{className:"flex items-center justify-end space-x-4",children:[(0,s.jsx)(i.tvw,{className:"navBtn"}),(0,s.jsx)(l.Oqj,{className:"h-6 md:hidden cursor-pointer"}),(0,s.jsxs)("div",{className:"relative navBtn",children:[(0,s.jsx)(l.Rdq,{className:"navBtn rotate-45"}),(0,s.jsxs)("div",{className:"absolute -top-1 -right-2 text-xs w-5 h-5 bg-red-500 rounded-full flex items-center justify-center animate-pulse text-white",children:[" ","3"," "]})]}),(0,s.jsx)("img",{src:"https://links.papareact.com/3ke",alt:"profile pic",className:"h-10 w-10 rounded-full cursor-pointer"})]})]})})};var m=function(){return(0,s.jsxs)("div",{className:"flex items-center justify-between mt-14 ml-10",children:[(0,s.jsx)("img",{className:"w-16 h-16 rounded-full border p-[2px]",src:"https://links.papareact.com/3ke",alt:""}),(0,s.jsxs)("div",{className:"flex-1 mx-4",children:[(0,s.jsx)("h2",{className:"font-bold",children:"Ruchi"}),(0,s.jsx)("h3",{className:"text-sm text-gray-400",children:"Excited to work at Spenny!"})]}),(0,s.jsx)("button",{className:"text-blue-400 text-sm font-semibold",children:"Sign Out"})]})};var d=function(e){e.id;var t=e.username,r=e.userImg,n=e.Img,a=e.caption;return(0,s.jsxs)("div",{className:"bg-white my-7 border rounded-sm",children:[(0,s.jsxs)("div",{className:"flex items-center p-5",children:[(0,s.jsx)("img",{src:r,className:"rounded-full h-12 w-12 object-contain border p-1 mr-3",alt:""}),(0,s.jsx)("p",{className:"flex-1 font-bold",children:t}),(0,s.jsx)(l.nWS,{className:"h-5"})]}),(0,s.jsx)("img",{src:n,className:"object-cover w-full",alt:""}),(0,s.jsx)("div",{className:"flex px-4 pt-4",children:(0,s.jsxs)("div",{className:"flex space-x-4",children:[(0,s.jsx)(l.h_8,{className:"btn"}),(0,s.jsx)(l.kBi,{className:"btn"}),(0,s.jsx)(l.Rdq,{className:"btn"})]})}),(0,s.jsxs)("p",{className:"p-5 truncate",children:[(0,s.jsx)("span",{className:"font-bold mr-1",children:t}),a]}),(0,s.jsxs)("form",{className:"flex items-center p-4",children:[(0,s.jsx)(l.OdW,{className:"h-7"}),(0,s.jsx)("input",{type:"text",placeholder:"Add comment..",className:"border-none flex-1 focus:ring-0 outline-none"}),(0,s.jsx)("button",{className:"font-semibold text-blue-400",children:"Post"})]})]})},u=[{id:"123",username:"ruchip16",userImg:"https://links.papareact.com/ocw",Img:"https://links.papareact.com/ocw",caption:"Woww, insta clone in makinggg"},{id:"123",username:"ruchip16",userImg:"https://links.papareact.com/ocw",Img:"https://links.papareact.com/ocw",caption:"Woww, insta clone in makinggg"}];var x=function(){return(0,s.jsx)("div",{children:u.map((function(e){return(0,s.jsx)(d,{id:e.id,username:e.username,userImg:e.userImg,Img:e.Img,caption:e.caption},e.id)}))})},f=r(85384),p=r.n(f);var h=function(e){var t=e.img,r=e.username;return(0,s.jsxs)("div",{children:[(0,s.jsx)("img",{className:"h-14 w-14 rounded-full p-[1.5px] border-red-500 border-2 object-contain cursor-pointer hover:scale-110 transition transform duration-200 ease-out",src:t,alt:""}),(0,s.jsx)("p",{className:"text-xs w-14 truncate text-center",children:r})]})};function j(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function b(e){return function(e){if(Array.isArray(e)){for(var t=0,r=new Array(e.length);t<e.length;t++)r[t]=e[t];return r}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}var g=function(){var e=(0,a.useState)([]),t=e[0],r=e[1];return(0,a.useEffect)((function(){var e=b(Array(20)).map((function(e,t){return function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},s=Object.keys(r);"function"===typeof Object.getOwnPropertySymbols&&(s=s.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),s.forEach((function(t){j(e,t,r[t])}))}return e}({},p().helpers.contextualCard(),{id:t})}));r(e)}),[]),(0,s.jsx)("div",{className:"flex space-x-2 p-6 bg-white mt-8 border-gray-200 border rounded-sm overflow-x-scroll scrollbar-thin scrollbar-thumb-black",children:t.map((function(e){return(0,s.jsx)(h,{img:e.avatar,username:e.username},e.id)}))})};function v(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function N(e){return function(e){if(Array.isArray(e)){for(var t=0,r=new Array(e.length);t<e.length;t++)r[t]=e[t];return r}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}var w=function(){var e=(0,a.useState)([]),t=e[0],r=e[1];return(0,a.useEffect)((function(){var e=N(Array(5)).map((function(e,t){return function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},s=Object.keys(r);"function"===typeof Object.getOwnPropertySymbols&&(s=s.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),s.forEach((function(t){v(e,t,r[t])}))}return e}({},p().helpers.contextualCard(),{id:t})}));r(e)}),[]),(0,s.jsxs)("div",{className:"mt-4 ml-10",children:[(0,s.jsxs)("div",{className:"flex justify-between text-sm mb-5",children:[(0,s.jsx)("h3",{className:"text-sm font-bold text-gray-400",children:"Suggestions for you"}),(0,s.jsx)("button",{className:"text-gray-600 font-semibold",children:"See All"})]}),t.map((function(e){return(0,s.jsxs)("div",{className:"flex items-center justify-between mt-3",children:[(0,s.jsx)("img",{className:"w-10 h-10 rounded-full border p-[2px]",src:e.avatar,alt:""}),(0,s.jsxs)("div",{className:"flex-1 ml-4",children:[(0,s.jsx)("h2",{className:"font-semibold text-sm",children:e.username}),(0,s.jsxs)("h3",{className:"text-xs text-gray-400",children:["Works at ",e.company.name]})]}),(0,s.jsx)("button",{className:"text-blue-400 text-sm font-bold",children:"Follow"})]},e.id)}))]})};var y=function(){return(0,s.jsxs)("main",{className:"grid grid-cols-1 md:grid-cols-2 md:max-w-3xl xl:grid-cols-3 xl:max-w-6xl mx-auto",children:[(0,s.jsxs)("section",{className:"col-span-2",children:[(0,s.jsx)(g,{}),(0,s.jsx)(x,{})]}),(0,s.jsx)("section",{className:"hidden xl:inline-grid md:col-span-1",children:(0,s.jsxs)("div",{children:[(0,s.jsx)(m,{}),(0,s.jsx)(w,{})]})})]})};function k(){return(0,s.jsxs)("div",{className:"bg-gray-50 h-screen overflow-y-scroll scrollbar-hide",children:[(0,s.jsxs)(n.default,{children:[(0,s.jsx)("title",{children:"Spenny Assignment"}),(0,s.jsx)("link",{rel:"icon",href:"/favicon.ico"})]}),(0,s.jsx)(o,{}),(0,s.jsx)(y,{})]})}}},function(e){e.O(0,[43,249,774,888,179],(function(){return t=78581,e(e.s=t);var t}));var t=e.O();_N_E=t}]);