{combinedMessages.map((msg, index) => {
              const isOwnMessage = msg.sender?._id === user?._id;

              // Determine chat type for icon
              let chatType = 'text';
              if (msg.media?.length) {
                const m = msg.media[0];
                if (m.type.startsWith('image')) chatType = 'image';
                else if (m.type.startsWith('video')) chatType = 'video';
                else if (m.type.startsWith('audio')) chatType = 'audio';
                else chatType = 'file';
              }

              // Icon for chat type
              const chatTypeIcon = {
                text: <Icon icon='mdi:chat-outline' className='text-lg mr-1 opacity-70' />,
                image: <Icon icon='mdi:image-outline' className='text-lg mr-1 opacity-70' />,
                video: <Icon icon='mdi:video-outline' className='text-lg mr-1 opacity-70' />,
                audio: <Icon icon='mdi:music-note-outline' className='text-lg mr-1 opacity-70' />,
                file: <Icon icon='mdi:file-outline' className='text-lg mr-1 opacity-70' />,
              }[chatType];

              return (
                <div
                  key={msg._id ? `${msg._id}_${msg.createdAt}` : `idx_${index}`}
                  className={`mb-2 flex ${isOwnMessage ? 'justify-end' : 'justify-start'}`}
                >
                  <div
                    className={`
                      px-3 py-2 rounded-2xl max-w-[85vw] sm:max-w-md break-words shadow
                      ${
                        isOwnMessage
                          ? 'bg-[var(--color-primary)] text-[var(--color-primary-foreground)]'
                          : 'bg-[var(--color-muted)] text-[var(--color-muted-foreground)]'
                      }
                      transition-colors
                    `}
                  >
                    <div className='flex items-center mb-1'>
                      {chatTypeIcon}
                      <span className='text-xs font-semibold opacity-80'>
                        {msg.sender?.fullName || 'User'}
                      </span>
                    </div>
                    <div className='text-md'>{msg.message}</div>
                    {/* Render media */}
                    {Array.isArray(msg.media) && msg.media.length > 0 && (
                      <div className='mt-2 space-y-2'>
                        {msg.media.map((m, i) => {
                          if (!m || !m.type || !m.uri) return null;

                          // IMAGE
                          if (m.type.startsWith('image')) {
                            return (
                              <div
                                key={m._id || i}
                                className='relative w-40 h-40 sm:w-64 sm:h-64 rounded-lg border border-[var(--color-border)] overflow-hidden'
                              >
                                <Image
                                  src={mediaUrl(m.uri, 'chat')}
                                  alt={m.uri}
                                  fill
                                  className='object-cover rounded-lg transition-opacity duration-500 opacity-0'
                                  onLoadingComplete={img => img.classList.remove('opacity-0')}
                                  placeholder='blur'
                                  blurDataURL='/placeholder.png'
                                  sizes='(max-width: 640px) 160px, 256px'
                                  loading='lazy'
                                />
                              </div>
                            );
                          }

                          // VIDEO
                          if (m.type.startsWith('video')) {
                            return (
                              <video
                                key={m._id || i}
                                src={mediaUrl(m.uri, 'chat')}
                                controls
                                className='w-64 h-40 sm:w-96 sm:h-56 object-cover rounded-lg border border-[var(--color-border)] max-w-full transition-opacity duration-500 opacity-0'
                                style={{ background: '#eee' }}
                                onLoadedData={e => e.currentTarget.classList.remove('opacity-0')}
                                preload='metadata'
                              />
                            );
                          }

                          // AUDIO
                          if (m.type.startsWith('audio')) {
                            return (
                              <audio
                                key={m._id || i}
                                src={mediaUrl(m.uri, 'chat')}
                                controls
                                className='w-64 sm:w-96'
                                style={{ minHeight: '48px' }}
                              />
                            );
                          }

                          // PDF
                          if (m.type === 'application/pdf') {
                            return (
                              <a
                                key={m._id || i}
                                href={mediaUrl(m.uri, 'chat')}
                                target='_blank'
                                rel='noopener noreferrer'
                                className='flex items-center space-x-2 p-2 rounded border border-[var(--color-border)] bg-[var(--color-muted)] hover:bg-[var(--color-accent)] transition'
                              >
                                <Icon icon='mdi:file-pdf-box' className='text-2xl text-red-600' />
                                <span className='truncate max-w-[12rem]'>
                                  {m.uri.split('/').pop()}
                                </span>
                              </a>
                            );
                          }

                          // CSV
                          if (m.type === 'text/csv') {
                            return (
                              <a
                                key={m._id || i}
                                href={mediaUrl(m.uri, 'chat')}
                                target='_blank'
                                rel='noopener noreferrer'
                                className='flex items-center space-x-2 p-2 rounded border border-[var(--color-border)] bg-[var(--color-muted)] hover:bg-[var(--color-accent)] transition'
                              >
                                <Icon
                                  icon='mdi:file-delimited-outline'
                                  className='text-2xl text-green-600'
                                />
                                <span className='truncate max-w-[12rem]'>
                                  {m.uri.split('/').pop()}
                                </span>
                              </a>
                            );
                          }

                          // GENERIC FILE (for any other allowed type)
                          return (
                            <a
                              key={m._id || i}
                              href={mediaUrl(m.uri, 'chat')}
                              target='_blank'
                              rel='noopener noreferrer'
                              className='flex items-center space-x-2 p-2 rounded border border-[var(--color-border)] bg-[var(--color-muted)] hover:bg-[var(--color-accent)] transition'
                            >
                              <Icon icon='mdi:file-outline' className='text-2xl' />
                              <span className='truncate max-w-[12rem]'>
                                {m.uri.split('/').pop()}
                              </span>
                            </a>
                          );
                        })}
                      </div>
                    )}
                  </div>
                </div>
              );
            })}

here please show the time stamp also 
as the data is present at this way

"createdAt": "2025-07-24T13:12:58.056Z"