Refine EC2 deploy and email templates UI

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
root 2026-02-13 19:55:54 +05:00
parent 71a75892a5
commit f2d4763ec0
2 changed files with 31 additions and 58 deletions

View File

@ -18,7 +18,7 @@ on:
- 'README.md' - 'README.md'
jobs: jobs:
build-app: build-and-deploy:
runs-on: ubuntu-22.04 runs-on: ubuntu-22.04
steps: steps:
- name: Checkout code - name: Checkout code
@ -40,37 +40,10 @@ jobs:
- name: Save application image - name: Save application image
run: | run: |
docker save -o junohub-app_latest.tar ${{ env.IMAGE_NAME }}:latest mkdir -p docker
docker save -o docker/junohub-app_latest.tar ${{ env.IMAGE_NAME }}:latest
echo "✅ Saved application image" echo "✅ Saved application image"
- name: Upload application image
uses: actions/upload-artifact@v4
with:
name: app-image
path: junohub-app_latest.tar
deploy:
runs-on: ubuntu-22.04
needs: [build-app]
steps:
- name: Checkout code
uses: actions/checkout@v4
- name: Download application image
uses: actions/download-artifact@v4
with:
name: app-image
path: docker
- name: Verify image tar
run: |
if [ ! -f docker/junohub-app_latest.tar ]; then
echo "ERROR: Application image tar missing after download"
ls -la docker/ || true
exit 1
fi
echo "✅ Application image tar ready for deploy"
- name: Set up environment file - name: Set up environment file
run: | run: |
# Base env for production container # Base env for production container

View File

@ -189,7 +189,7 @@ export default function EmailTemplatesPage() {
: "" : ""
return ( return (
<div className="h-full flex flex-col space-y-4 md:space-y-6"> <div className="h-full flex flex-col space-y-4 md:space-y-6 mt-4 md:mt-6">
<div className="bg-white/5 backdrop-blur-xl rounded-xl md:rounded-2xl border border-white/10 overflow-hidden flex flex-col flex-1 min-h-0"> <div className="bg-white/5 backdrop-blur-xl rounded-xl md:rounded-2xl border border-white/10 overflow-hidden flex flex-col flex-1 min-h-0">
<div className="p-4 md:p-6 border-b border-white/10 flex flex-col sm:flex-row gap-3 md:gap-4 justify-between bg-white/5 flex-shrink-0"> <div className="p-4 md:p-6 border-b border-white/10 flex flex-col sm:flex-row gap-3 md:gap-4 justify-between bg-white/5 flex-shrink-0">
<div className="relative flex-1 min-w-0"> <div className="relative flex-1 min-w-0">
@ -288,21 +288,21 @@ export default function EmailTemplatesPage() {
</div> </div>
{editing && ( {editing && (
<div className="fixed inset-0 z-40 flex items-center justify-end bg-black/40 backdrop-blur-sm"> <div className="fixed inset-0 z-40 flex items-start justify-center bg-slate-900/40 dark:bg-black/50 px-4 pt-20 md:pt-24">
<div className="w-full max-w-2xl h-full md:h-auto md:max-h-[90vh] bg-slate-950/95 border-l border-white/10 md:rounded-l-2xl md:mr-4 md:mb-4 shadow-2xl flex flex-col"> <div className="w-full max-w-3xl max-h-[90vh] bg-white text-slate-900 dark:bg-slate-950 dark:text-slate-50 border border-slate-200 dark:border-white/10 rounded-2xl shadow-2xl flex flex-col">
<div className="px-5 py-4 border-b border-white/10 flex items-center justify-between"> <div className="px-5 py-4 border-b border-slate-200 dark:border-white/10 flex items-center justify-between">
<div> <div>
<h2 className="text-lg font-bold text-white"> <h2 className="text-lg font-bold">
{editing.id ? "Edit template" : "New template"} {editing.id ? "Edit template" : "New template"}
</h2> </h2>
<p className="text-xs text-slate-400 mt-0.5"> <p className="text-xs text-slate-500 dark:text-slate-400 mt-0.5">
Use {"{{variable}}"} placeholders to personalize replies. Use {"{{variable}}"} placeholders to personalize replies.
</p> </p>
</div> </div>
<button <button
type="button" type="button"
onClick={() => setEditing(null)} onClick={() => setEditing(null)}
className="text-slate-400 hover:text-white text-sm" className="text-slate-500 dark:text-slate-400 hover:text-slate-900 dark:hover:text-white text-sm"
> >
Close Close
</button> </button>
@ -312,7 +312,7 @@ export default function EmailTemplatesPage() {
<div className="grid grid-cols-1 md:grid-cols-2 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="space-y-3"> <div className="space-y-3">
<div> <div>
<label className="block text-xs font-semibold text-slate-300 mb-1"> <label className="block text-xs font-semibold text-slate-700 dark:text-slate-300 mb-1">
Name Name
</label> </label>
<input <input
@ -325,13 +325,13 @@ export default function EmailTemplatesPage() {
: prev, : prev,
) )
} }
className="w-full h-9 px-3 rounded-lg bg-slate-900/60 border border-white/10 text-sm text-white focus:outline-none focus:ring-2 focus:ring-indigo-500/40" className="w-full h-9 px-3 rounded-lg bg-slate-50 dark:bg-slate-900/60 border border-slate-200 dark:border-white/10 text-sm text-slate-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-indigo-500/40"
/> />
</div> </div>
<div className="grid grid-cols-2 gap-3"> <div className="grid grid-cols-2 gap-3">
<div> <div>
<label className="block text-xs font-semibold text-slate-300 mb-1"> <label className="block text-xs font-semibold text-slate-700 dark:text-slate-300 mb-1">
Intent Intent
</label> </label>
<select <select
@ -346,7 +346,7 @@ export default function EmailTemplatesPage() {
: prev, : prev,
) )
} }
className="w-full h-9 px-3 rounded-lg bg-slate-900/60 border border-white/10 text-xs text-white focus:outline-none focus:ring-2 focus:ring-indigo-500/40" className="w-full h-9 px-3 rounded-lg bg-slate-50 dark:bg-slate-900/60 border border-slate-200 dark:border-white/10 text-xs text-slate-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-indigo-500/40"
> >
{INTENT_OPTIONS.map((opt) => ( {INTENT_OPTIONS.map((opt) => (
<option key={opt.value} value={opt.value}> <option key={opt.value} value={opt.value}>
@ -356,7 +356,7 @@ export default function EmailTemplatesPage() {
</select> </select>
</div> </div>
<div> <div>
<label className="block text-xs font-semibold text-slate-300 mb-1"> <label className="block text-xs font-semibold text-slate-700 dark:text-slate-300 mb-1">
Mood Mood
</label> </label>
<select <select
@ -371,7 +371,7 @@ export default function EmailTemplatesPage() {
: prev, : prev,
) )
} }
className="w-full h-9 px-3 rounded-lg bg-slate-900/60 border border-white/10 text-xs text-white focus:outline-none focus:ring-2 focus:ring-indigo-500/40" className="w-full h-9 px-3 rounded-lg bg-slate-50 dark:bg-slate-900/60 border border-slate-200 dark:border-white/10 text-xs text-slate-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-indigo-500/40"
> >
{MOOD_OPTIONS.map((opt) => ( {MOOD_OPTIONS.map((opt) => (
<option key={opt.value} value={opt.value}> <option key={opt.value} value={opt.value}>
@ -383,7 +383,7 @@ export default function EmailTemplatesPage() {
</div> </div>
<div> <div>
<label className="block text-xs font-semibold text-slate-300 mb-1"> <label className="block text-xs font-semibold text-slate-700 dark:text-slate-300 mb-1">
Description (optional) Description (optional)
</label> </label>
<input <input
@ -399,37 +399,37 @@ export default function EmailTemplatesPage() {
: prev, : prev,
) )
} }
className="w-full h-9 px-3 rounded-lg bg-slate-900/60 border border-white/10 text-sm text-white focus:outline-none focus:ring-2 focus:ring-indigo-500/40" className="w-full h-9 px-3 rounded-lg bg-slate-50 dark:bg-slate-900/60 border border-slate-200 dark:border-white/10 text-sm text-slate-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-indigo-500/40"
placeholder="Short summary for your team" placeholder="Short summary for your team"
/> />
</div> </div>
</div> </div>
<div className="space-y-2 text-xs text-slate-400"> <div className="space-y-2 text-xs text-slate-600 dark:text-slate-400">
<p className="font-semibold text-slate-200"> <p className="font-semibold text-slate-800 dark:text-slate-200">
Available variables Available variables
</p> </p>
<ul className="space-y-1"> <ul className="space-y-1">
<li> <li>
<code className="px-1.5 py-0.5 bg-slate-900/80 rounded border border-white/10 text-[11px]"> <code className="px-1.5 py-0.5 bg-slate-100 dark:bg-slate-900/80 rounded border border-slate-200 dark:border-white/10 text-[11px]">
{"{{customer_name}}"} {"{{customer_name}}"}
</code>{" "} </code>{" "}
– Customer’s name – Customer’s name
</li> </li>
<li> <li>
<code className="px-1.5 py-0.5 bg-slate-900/80 rounded border border-white/10 text-[11px]"> <code className="px-1.5 py-0.5 bg-slate-100 dark:bg-slate-900/80 rounded border border-slate-200 dark:border-white/10 text-[11px]">
{"{{customer_email}}"} {"{{customer_email}}"}
</code>{" "} </code>{" "}
– Customer’s email – Customer’s email
</li> </li>
<li> <li>
<code className="px-1.5 py-0.5 bg-slate-900/80 rounded border border-white/10 text-[11px]"> <code className="px-1.5 py-0.5 bg-slate-100 dark:bg-slate-900/80 rounded border border-slate-200 dark:border-white/10 text-[11px]">
{"{{store_name}}"} {"{{store_name}}"}
</code>{" "} </code>{" "}
– Store name – Store name
</li> </li>
<li> <li>
<code className="px-1.5 py-0.5 bg-slate-900/80 rounded border border-white/10 text-[11px]"> <code className="px-1.5 py-0.5 bg-slate-100 dark:bg-slate-900/80 rounded border border-slate-200 dark:border-white/10 text-[11px]">
{"{{ticket_summary}}"} {"{{ticket_summary}}"}
</code>{" "} </code>{" "}
– Short summary of the customer’s email – Short summary of the customer’s email
@ -439,7 +439,7 @@ export default function EmailTemplatesPage() {
</div> </div>
<div> <div>
<label className="block text-xs font-semibold text-slate-300 mb-1"> <label className="block text-xs font-semibold text-slate-700 dark:text-slate-300 mb-1">
Template body Template body
</label> </label>
<textarea <textarea
@ -450,29 +450,29 @@ export default function EmailTemplatesPage() {
) )
} }
rows={8} rows={8}
className="w-full rounded-lg bg-slate-900/60 border border-white/10 text-xs text-slate-100 font-mono p-3 focus:outline-none focus:ring-2 focus:ring-indigo-500/40" className="w-full rounded-lg bg-slate-50 dark:bg-slate-900/60 border border-slate-200 dark:border-white/10 text-xs text-slate-900 dark:text-slate-100 font-mono p-3 focus:outline-none focus:ring-2 focus:ring-indigo-500/40"
/> />
</div> </div>
<div> <div>
<p className="text-xs font-semibold text-slate-300 mb-1"> <p className="text-xs font-semibold text-slate-700 dark:text-slate-300 mb-1">
Preview with example data Preview with example data
</p> </p>
<div className="rounded-lg border border-white/10 bg-slate-900/80 p-4 text-xs text-slate-100 whitespace-pre-wrap"> <div className="rounded-lg border border-slate-200 dark:border-white/10 bg-slate-50 dark:bg-slate-900/80 p-4 text-xs text-slate-900 dark:text-slate-100 whitespace-pre-wrap">
{currentPreview || "Preview will appear here."} {currentPreview || "Preview will appear here."}
</div> </div>
</div> </div>
</div> </div>
<div className="px-5 py-3 border-t border-white/10 flex items-center justify-between"> <div className="px-5 py-3 border-t border-slate-200 dark:border-white/10 flex items-center justify-between">
<p className="text-[11px] text-slate-500"> <p className="text-[11px] text-slate-500 dark:text-slate-500">
Templates use simple {"{{variable}}"} placeholders only. Templates use simple {"{{variable}}"} placeholders only.
</p> </p>
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<button <button
type="button" type="button"
onClick={() => setEditing(null)} onClick={() => setEditing(null)}
className="h-8 px-3 rounded-lg border border-white/10 text-xs text-slate-300 hover:bg-white/10" className="h-8 px-3 rounded-lg border border-slate-200 dark:border-white/10 text-xs text-slate-700 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-white/10"
> >
Cancel Cancel
</button> </button>