Wire admin studio SSR and search infrastructure

resources/js/components/Feed/PostComposer.jsx

@@ -3,6 +3,7 @@ import axios from 'axios'
 import ShareArtworkModal from './ShareArtworkModal'
 import LinkPreviewCard from './LinkPreviewCard'
 import TagPeopleModal from './TagPeopleModal'
+import DateTimePicker from '../ui/DateTimePicker'
 import extractNativeEmoji from '../common/extractNativeEmoji'
 import isEventWithinNode from '../common/isEventWithinNode'
 
@@ -274,13 +275,14 @@ export default function PostComposer({ user, onPosted }) {
                 <div className="flex items-center gap-2.5 p-3 rounded-xl bg-violet-500/10 border border-violet-500/20">
                   <i className="fa-regular fa-calendar-plus text-violet-400 text-sm fa-fw shrink-0" />
                   <div className="flex-1">
-                    <label className="block text-[11px] text-slate-400 mb-1">Publish on</label>
-                    <input
-                      type="datetime-local"
+                    <div className="block text-[11px] text-slate-400 mb-1">Publish on</div>
+                    <DateTimePicker
                       value={scheduledAt}
-                      onChange={(e) => setScheduledAt(e.target.value)}
-                      min={new Date(Date.now() + 60_000).toISOString().slice(0, 16)}
-                      className="bg-transparent text-sm text-white border-none outline-none w-full [color-scheme:dark]"
+                      onChange={setScheduledAt}
+                      minDateTime={new Date(Date.now() + 60_000).toISOString().slice(0, 16)}
+                      placeholder="Pick a publish slot"
+                      clearable
+                      className="border-violet-300/20 bg-violet-500/10"
                     />
                     <p className="text-[10px] text-slate-500 mt-1">
                       {Intl.DateTimeFormat().resolvedOptions().timeZone}