Completion
{local}%
{ dragging.current=true; setLocal(Math.min(+e.target.value,maxValue)); }}
onPointerUp={e=>{ dragging.current=false; onChange(Math.min(+e.target.value,maxValue)); }}
onMouseUp={e=>{ dragging.current=false; onChange(Math.min(+e.target.value,maxValue)); }}
style={{position:"absolute",top:-8,left:0,width:"100%",height:24,opacity:0,cursor:"pointer",margin:0,padding:0}}/>
{[0,25,50,75,100].map(v=>maxValue?0.3:1}}>{v}%)}
Team Sign In
{err}
}
;
if(!user) return ;
const isAdmin=user.role==="admin";
const visible=isAdmin?projs:projs.filter(p=>p.pmId===user.id);
const sel=visible.find(p=>p.id===selId);
const navTabs=[
{id:"projects", label:"Projects"},
{id:"reports", label:"Reports"},
{id:"settings", label:"Settings"},
];
const goTab = id => {
setTab(id); setSelId(null);
if (scrollRef.current) scrollRef.current.scrollTop = 0;
};
return
{/* Top bar */}
{user.name}
{isAdmin?"Admin":"Project Manager"}
{selId&&sel
?{ setSelId(null); if(scrollRef.current) scrollRef.current.scrollTop=0; }}/>
:tab==="projects"?{ setSelId(id); if(scrollRef.current) scrollRef.current.scrollTop=0; }}/>
:tab==="reports"?p.pmId===user.id)} isAdmin={isAdmin} user={user}/>
:
}
{!selId&&
{navTabs.map(t=>
;
}
/* ── Project Row ── */
function ProjectRow({p,onSelect,isAdmin,onSave,allProjects}){
const pmts=p.payments||[];
const totalPd=p.paidInFull?(p.value||0):pmts.reduce((s,x)=>s+x.amount,0);
const bal=p.paidInFull?0:(p.value||0)-totalPd;
const pmUser=USERS.find(u=>u.id===p.pmId);
const pct=p.completion||0;
const col=pct===100?GR:pct>=60?AC:BL;
const base=projBase(p), cost=projCost(p), gp=base-cost;
const gpPct=base?(gp/base)*100:0;
const pmCut=(gp*(p.pmPct||0))/100;
const isFinished=p.status==="completed"&&p.paidInFull;
return onSelect(p.id)} style={{background:W,border:`1px solid ${BD}`,borderRadius:14,padding:"14px 16px",marginBottom:10,cursor:"pointer",transition:"box-shadow .15s"}}
onMouseEnter={e=>e.currentTarget.style.boxShadow="0 4px 16px rgba(26,47,74,0.12)"}
onMouseLeave={e=>e.currentTarget.style.boxShadow="none"}>
{/* Slim read-only progress bar */}
{isAdmin&&pmUser&&}
;
}
/* ── Projects Page ── */
function ProjectsPage({projects,allProjects,subCos,splits,user,isAdmin,onSave,onSelect}){
const[showNew,setShowNew]=useState(false);
const srt=arr=>[...arr].sort((a,b)=>(b.completedDate||b.createdAt||"").localeCompare(a.completedDate||a.createdAt||""));
const running =[...projects.filter(p=>!(p.status==="completed"&&p.paidInFull))].sort((a,b)=>(b.completion||0)-(a.completion||0));
const needSplit=isAdmin?srt(projects.filter(p=>p.status==="completed"&&p.paidInFull&&!p.splitDone)):[];
const done =isAdmin?srt(projects.filter(p=>p.status==="completed"&&p.paidInFull&&p.splitDone)):srt(projects.filter(p=>p.status==="completed"&&p.paidInFull&&p.splitDone));
const awaitingComm=!isAdmin?srt(projects.filter(p=>p.status==="completed"&&p.paidInFull&&!p.splitDone)):[];
// Jobs with undeposited checks OR subs marked ready to pay but not yet paid
const collectDeposit=isAdmin?srt(projects.filter(p=>
!needSplit.find(n=>n.id===p.id) && (
(p.payments||[]).some(pmt=>!pmt.deposited) ||
(p.subs||[]).some(s=>s.readyToPay&&(!s.payStatus||s.payStatus==="unpaid"||s.payStatus==="partial")&&!isDebit(s))
)
)):[];
const rp={onSelect,isAdmin,onSave:v=>onSave(v),allProjects};
return
setShowNew(true)} color={AC} sm>+ New
{/* Admin action sections first */}
{isAdmin&&collectDeposit.length>0&&
{collectDeposit.map(p=>{
const unhandled=(p.payments||[]).filter(pmt=>!pmt.givenToAdmin&&!pmt.deposited);
const pendingDeposit=(p.payments||[]).filter(pmt=>pmt.givenToAdmin&&!pmt.deposited);
const readySubs=(p.subs||[]).filter(s=>s.readyToPay&&(!s.payStatus||s.payStatus==="unpaid"||s.payStatus==="partial")&&!isDebit(s));
return }
{isAdmin&&needSplit.length>0&&
{needSplit.map(p=> }
{running.length===0?
{!isAdmin&&awaitingComm.length>0&&
{awaitingComm.map(p=> }
{done.length===0?
{showNew&&setShowNew(false)}>
{onSave([...allProjects,{...p,id:uid(),subs:[],payments:[],createdAt:today(),status:"active",customerPaid:0,paidInFull:false,splitDone:false,completion:0,deposited:false}]);setShowNew(false);}}/>
}
;
}
function Section({title,color,count,children}){
const countStr=count!=null?` · ${count} ${count===1?"project":"projects"}`:""
return
{children}
;
}
/* ── New Project Form ── */
function NewProjForm({splits,user,isAdmin,onSubmit}){
const pms=USERS.filter(u=>u.role==="pm");
const defPmId=isAdmin?"":user.id;
const defPmPct=isAdmin?0:getPmPct(user.username,false,splits);
const[f,setF]=useState({name:"",state:"WA",taxCity:"Vancouver",taxRate:8.9,subTotal:"",pmId:defPmId,pmPct:defPmPct,attendedEst:false,marketingPct:splits.marketing||10,overheadPct:splits.overhead||5});
const set=(k,v)=>setF(p=>({...p,[k]:v}));
const onPm=v=>{const u=USERS.find(x=>x.id===v);setF(p=>({...p,pmId:v,pmPct:getPmPct(u?.username||"",false,splits),attendedEst:false}));};
const onEst=v=>{const u=USERS.find(x=>x.id===f.pmId);setF(p=>({...p,attendedEst:v,pmPct:getPmPct(u?.username||"",v,splits)}));};
const onState=v=>setF(p=>({...p,state:v,taxCity:v==="OR"?"":p.taxCity||"Vancouver",taxRate:v==="OR"?0:rateForCity(p.taxCity||"Vancouver")}));
const onCity=v=>setF(p=>({...p,taxCity:v,taxRate:rateForCity(v)}));
const sub=+f.subTotal||0, tax=f.state==="WA"?sub*(+f.taxRate||0)/100:0, grand=sub+tax;
const isCory=USERS.find(x=>x.id===f.pmId)?.username==="cory";
return
set("name",v)} placeholder="Smith Family — Master Bath"/>
{f.state==="WA"&&}
set("subTotal",v)} type="number" placeholder="0"/>
{f.state==="WA"&&sub>0&&
}
{isAdmin&&<>({v:u.id,l:u.name}))]}/>
{isCory&&
{setF(p=>({...p,attendedEst:v,pmPct:getPmPct("cory",v,splits)}));}} label={`I also estimated this project (+${splits.pm_cory_bonus||5}%)`} color={AC}/>
{f.attendedEst&&
)}
{if(!f.name.trim()||!sub)return;onSubmit({...f,subTotal:sub,value:grand,customerTax:tax,pmPct:+f.pmPct||0,marketingPct:+f.marketingPct||0,overheadPct:+f.overheadPct||0,taxRate:+f.taxRate||0});}}>Create Project
;
}
/* ── Detail Page ── */
function DetailPage({project,projects,subCos,splits,user,isAdmin,onSave,onBack}){
const[showSubSheet,setShowSubSheet]=useState(false);
const[editSub,setEditSub]=useState(null);
const[showEdit,setShowEdit]=useState(false);
const[showOverride,setShowOverride]=useState(false);
const upd=u=>onSave(projects.map(p=>p.id===u.id?u:p));
// Weekly completion update gate — active jobs only
const daysSinceUpdate = () => {
if (!project.completionUpdatedAt) return 999;
const then = new Date(project.completionUpdatedAt);
const now = new Date();
return Math.floor((now - then) / (1000*60*60*24));
};
const isActive = project.status !== "completed";
const needsWeeklyUpdate = isActive && daysSinceUpdate() >= 1;
const[weeklyDone, setWeeklyDone] = useState(!needsWeeklyUpdate);
const[balanceWarning, setBalanceWarning] = useState(false);
const onCompletionChange = v => {
// Non-admin can't reach 100% while balance is still owed or checks not handed to admin
const uncheckedChecks = pmts.filter(p => !p.givenToAdmin);
const blocked = !isAdmin && v === 100 && (bal > 0 || uncheckedChecks.length > 0);
if (blocked) {
setBalanceWarning(true);
upd({...project, completion:99, completionUpdatedAt:today()});
setWeeklyDone(true);
return;
}
setBalanceWarning(false);
const wasAutoCompleted = project.completion===100 && project.status==="completed";
const extra = v===100
? {status:"completed", completedDate:project.completedDate||today()}
: (wasAutoCompleted ? {status:"active", completedDate:null, paidInFull:false} : {});
upd({...project, completion:v, completionUpdatedAt:today(), ...extra});
setWeeklyDone(true);
};
// Wrap all save actions to require weekly update first
const guarded = fn => (...args) => {
if (!weeklyDone) return;
fn(...args);
};
const onStatus=v=>upd({...project,status:v?"completed":"active",completedDate:v?today():null,...(v?{completion:100,completionUpdatedAt:today()}:{})});
const addPmt=amt=>{
const rate=project.state==="WA"?(+project.taxRate||0):0;
const tax=rate>0?amt-amt/(1+rate/100):0;
const newPmts=[...(project.payments||[]),{id:uid(),amount:amt,date:today(),tax}];
const newTotal=newPmts.reduce((s,p)=>s+p.amount,0);
const nowFull=Math.abs(newTotal-(project.value||0))<0.02;
upd({...project,payments:newPmts,customerPaid:newTotal,customerTax:newPmts.reduce((s,p)=>s+(p.tax||0),0),
paidInFull:nowFull});
};
const delPmt=id=>{
const newPmts=(project.payments||[]).filter(p=>p.id!==id);
const newTotal=newPmts.reduce((s,p)=>s+p.amount,0);
const nowFull=newPmts.length>0&&Math.abs(newTotal-(project.value||0))<0.02;
upd({...project,payments:newPmts,customerPaid:newTotal,customerTax:newPmts.reduce((s,p)=>s+(p.tax||0),0),paidInFull:nowFull});
};
const delSub=id=>upd({...project,subs:(project.subs||[]).filter(s=>s.id!==id)});
const addSubFn = s => {
const entry = isDebit(s)?{...s,payStatus:"paid",readyToPay:false}:s;
const u=editSub?{...project,subs:(project.subs||[]).map(x=>x.id===entry.id?entry:x)}:{...project,subs:[...(project.subs||[]),{...entry,id:uid()}]};
upd(u);setShowSubSheet(false);setEditSub(null);
};
const subs=project.subs||[], pmts=project.payments||[];
const cost=projCost(project);
const base=projBase(project);
const gp=base-cost;
const gpPct=base?(gp/base)*100:0;
const pmCut=(gp*(project.pmPct||0))/100;
const mktCut=(gp*(project.marketingPct||0))/100;
const ovhCut=(gp*(project.overheadPct||0))/100;
const netPaliy=gp-pmCut-mktCut-ovhCut;
const pmUser=USERS.find(u=>u.id===project.pmId);
const totalPaid=project.paidInFull?(project.value||0):pmts.reduce((s,p)=>s+p.amount,0);
const bal=project.paidInFull?0:(project.value||0)-totalPaid;
const taxPaidSubs=subs.reduce((s,x)=>s+(x.inclTax?((x.cost||0)*(x.taxRate||0))/100:0),0);
return
;
}
/* ── Sub Form ── */
function SubForm({initial,subCos,projectState,defaultTax,isAdmin,onSubmit}){
const opts=subCos.map((s,i)=>{
const co=typeof s==="string"?s:(s.company||"");
const nk=typeof s==="object"?(s.nickname||""):"";
return{key:i,company:co,nickname:nk,label:nk?`${co} — ${nk}`:co};
}).filter(o=>o.company);
const initIdx=initial?opts.findIndex(o=>o.company===initial.company):-1;
const[selIdx,setSelIdx]=useState(initIdx>=0?String(initIdx):"");
const[f,setF]=useState(initial||{company:"",nickname:"",desc:"",cost:"",inclTax:projectState==="WA",taxRate:defaultTax||8.7,payStatus:"unpaid",paidAmt:""});
const set=(k,v)=>setF(p=>({...p,[k]:v}));
const onSel=idx=>{setSelIdx(idx);if(idx===""){setF(p=>({...p,company:"",nickname:""}));return;}const o=opts[+idx];if(o)setF(p=>({...p,company:o.company,nickname:o.nickname}));};
const tax=f.inclTax?((+f.cost||0)*(+f.taxRate||0))/100:0, tot=(+f.cost||0)+tax;
return
set("desc",v)} placeholder="Re-piping, tile, demo…"/>
set("cost",v)} type="number" placeholder="0"/>
{projectState==="WA"&&
set("inclTax",v)} label="Include Sales Tax"/>
{f.inclTax&&set("taxCity",v)&&set("taxRate",rateForCity(v))||setF(p=>({...p,taxCity:v,taxRate:rateForCity(v)}))} options={cityOpts} mb={0}/> }
}
{!!f.cost&&
set("paidAmt",v)} type="number" placeholder="0"/>}
{if(!f.company||!f.cost)return;onSubmit({...f,cost:+f.cost||0,taxRate:+f.taxRate||0,paidAmt:+f.paidAmt||0});}}>Save
;
}
/* ── Edit Project Form ── */
function EditProjForm({project,splits,isAdmin,onSubmit,onDelete}){
const pms=USERS.filter(u=>u.role==="pm");
const[confirmDel,setConfirmDel]=useState(false);
const stored=project.subTotal?project.subTotal:(project.state==="WA"&&project.taxRate?(project.value||0)/(1+(+project.taxRate||0)/100):(project.value||0));
const defCity=project.taxCity||(WA_CITIES.find(c=>c.rate===(project.taxRate||8.9))?.city)||"Vancouver";
const[f,setF]=useState({name:project.name||"",state:project.state||"WA",taxCity:defCity,taxRate:project.taxRate||8.9,subTotal:String(Math.round(stored*100)/100||""),pmId:project.pmId||"",pmPct:project.pmPct||0,attendedEst:project.attendedEst||false,marketingPct:project.marketingPct||splits.marketing,overheadPct:project.overheadPct||splits.overhead});
const set=(k,v)=>setF(p=>({...p,[k]:v}));
const onPm=v=>{const u=USERS.find(x=>x.id===v);setF(p=>({...p,pmId:v,pmPct:getPmPct(u?.username||"",false,splits),attendedEst:false}));};
const onEst=v=>{const u=USERS.find(x=>x.id===f.pmId);setF(p=>({...p,attendedEst:v,pmPct:getPmPct(u?.username||"",v,splits)}));};
const onState=v=>setF(p=>({...p,state:v,taxCity:v==="OR"?"":p.taxCity||"Vancouver",taxRate:v==="OR"?0:rateForCity(p.taxCity||"Vancouver")}));
const onCity=v=>setF(p=>({...p,taxCity:v,taxRate:rateForCity(v)}));
const isCory=USERS.find(x=>x.id===f.pmId)?.username==="cory";
const sub=+f.subTotal||0, tax=f.state==="WA"?sub*(+f.taxRate||0)/100:0, grand=sub+tax;
return
set("name",v)}/>
{f.state==="WA"&&}
set("subTotal",v)} type="number"/>
{f.state==="WA"&&sub>0&&
}
{isAdmin&&<>({v:u.id,l:u.name}))]}/>
{isCory&&
set("pmPct",+v)} type="number" mb={0}/>
set("marketingPct",+v)} type="number" mb={0}/>
set("overheadPct",+v)} type="number" mb={0}/>
}
{if(!f.name.trim())return;onSubmit({...f,subTotal:sub,value:grand,customerTax:tax,pmPct:+f.pmPct||0,marketingPct:+f.marketingPct||0,overheadPct:+f.overheadPct||0,taxRate:+f.taxRate||0});}}>Save Changes
;
}
/* ── Reports ── */
const MONTHS=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
function ReportsPage({projects, isAdmin, user}){
const allYears=[...new Set(projects.map(p=>(p.completedDate||p.createdAt||"").slice(0,4)).filter(Boolean))].sort().reverse();
const[yr,setYr]=useState(allYears[0]||"all");
const[mo,setMo]=useState("all");
const[st,setSt]=useState("both");
const[jobStatus,setJobStatus]=useState("done"); // admin only: done | split | ongoing
const onYr=v=>{setYr(v);setMo("all");};
const base_qual = isAdmin
? projects.filter(p=>{
if(jobStatus==="done") return p.status==="completed"&&p.paidInFull&&p.splitDone;
if(jobStatus==="split") return p.status==="completed"&&p.paidInFull&&!p.splitDone;
if(jobStatus==="ongoing") return !(p.status==="completed"&&p.paidInFull);
return p.status==="completed"&&p.paidInFull;
})
: projects.filter(p=>p.status==="completed"&&p.paidInFull);
const fil=base_qual.filter(p=>{
const d=p.completedDate||p.createdAt||"";
if(yr!=="all"&&!d.startsWith(yr))return false;
if(mo!=="all"&&d.slice(5,7)!==mo)return false;
if(st==="WA"&&p.state==="OR")return false;
if(st==="OR"&&(p.state||"WA")!=="OR")return false;
return true;
});
const rev=fil.reduce((s,p)=>s+(p.value||0),0);
const preRev=fil.reduce((s,p)=>s+projBase(p),0);
const cost=fil.reduce((s,p)=>s+projCost(p),0);
const gp=preRev-cost;
const gpP=preRev?(gp/preRev)*100:0;
const taxCol=fil.reduce((s,p)=>s+(p.customerTax||0),0);
const taxSubs=fil.reduce((s,p)=>s+(p.subs||[]).reduce((t,x)=>t+(x.inclTax?((x.cost||0)*(x.taxRate||0))/100:0),0),0);
const collected=fil.reduce((s,p)=>s+(p.paidInFull?(p.value||0):(p.customerPaid||0)),0);
const outstanding=projects.filter(p=>!p.paidInFull).reduce((s,p)=>s+((p.value||0)-(p.customerPaid||0)),0);
const waCount=fil.filter(p=>(p.state||"WA")==="WA").length;
const orCount=fil.filter(p=>p.state==="OR").length;
const waRev=fil.filter(p=>(p.state||"WA")==="WA").reduce((s,p)=>s+(p.value||0),0);
const orRev=fil.filter(p=>p.state==="OR").reduce((s,p)=>s+(p.value||0),0);
const mktTotal=fil.reduce((s,p)=>{ const g=projBase(p)-projCost(p); return s+(g*(p.marketingPct||0))/100; },0);
const ovhTotal=fil.reduce((s,p)=>{ const g=projBase(p)-projCost(p); return s+(g*(p.overheadPct||0))/100; },0);
const pmTotal =fil.reduce((s,p)=>{ const g=projBase(p)-projCost(p); return s+(g*(p.pmPct||0))/100; },0);
const paliyNet=gp-pmTotal-mktTotal-ovhTotal;
const activeMos=[...new Set(
base_qual
.filter(p=>yr==="all"||(p.completedDate||p.createdAt||"").startsWith(yr))
.map(p=>(p.completedDate||p.createdAt||"").slice(5,7))
.filter(Boolean)
)].sort();
const bySub={};
fil.forEach(p=>(p.subs||[]).forEach(s=>{const k=s.nickname?`${s.company} (${s.nickname})`:(s.company||"Unknown");bySub[k]=(bySub[k]||0)+subTot(s);}));
const Stat=({l,v,c=N})=>
;
return
}
{/* Year */}
=30?GR:gpP>=15?AC:RE}/>
}
{/* Admin full stats */}
{isAdmin&&<>
=30?GR:gpP>=15?AC:RE}/>
0?RE:GR}/>
}
)}
{/* Job Status list — 3 sections for admin, simple for PM */}
{(()=>{
const allProjects = projects; // full unfiltered list for status grouping
// For admin: show 3 groups across ALL projects (not just filtered by year/month)
// For PM: show their completed jobs
if(isAdmin){
const pending = allProjects.filter(p=>p.status==="completed"&&!p.paidInFull);
const needSplit = allProjects.filter(p=>p.status==="completed"&&p.paidInFull&&!p.splitDone);
const completed = allProjects.filter(p=>p.status==="completed"&&p.paidInFull&&p.splitDone);
const JobRow = ({p})=>{
const pg=projBase(p)-projCost(p), pp=projBase(p)?(pg/projBase(p))*100:0, pm=USERS.find(u=>u.id===p.pmId);
return
;
};
const Section3 = ({title,color,jobs})=>
{jobs.length===0?)}
;
return <>
;
}
// PM view — just their completed jobs
return
{p.completedDate&&{p.completedDate}}
;
})}
;
})()}
;
}
/* ── Settings ── */
function SettingsPage({subCos,splits,isAdmin,onSaveSubs,onSaveSplits}){
const[tab,setTab]=useState("subs");
const[coName,setCoName]=useState(""), [coNick,setCoNick]=useState("");
const[sp,setSp]=useState({...DEF_SPLITS,...splits});
const addSub=()=>{if(!coName.trim())return;onSaveSubs([...subCos,{company:coName.trim(),nickname:coNick.trim()}]);setCoName("");setCoNick("");};
const saveSp=()=>{const u={marketing:+sp.marketing||0,overhead:+sp.overhead||0,pm_ivan:+sp.pm_ivan||25,pm_cory:+sp.pm_cory||20,pm_cory_bonus:+sp.pm_cory_bonus||5,pm_yuriy:+sp.pm_yuriy||25,pm_mark:+sp.pm_mark||25};onSaveSplits(u);alert("Saved.");};
const tabs=isAdmin?[["subs","Subcontractors"],["splits","Splits"]]:[["subs","Subcontractors"]];
return
Add
{subCos.length===0?
setSp(s=>({...s,marketing:v}))} type="number" mb={0}/>
setSp(s=>({...s,overhead:v}))} type="number" mb={0}/>
Save All Splits
}
;
}
/* ── Mount the app ── */
const _root = ReactDOM.createRoot(document.getElementById('root'));
_root.render(React.createElement(App));
Completion
{pct}%
{p.name}
{isAdmin?(
<>
{fmt(p.value||0)}
0?RE:MU,marginTop:2}}>
{p.paidInFull?"✓ Paid in Full":bal>0?`${fmt(bal)} owed`:`${pmts.length} check${pmts.length!==1?"s":""}${pmts.length===0?" — unpaid":""}`}
):(
isFinished?(
<>
commission · =30?GR:gpPct>=15?AC:RE}}>{pctf(gpPct)} GP
{fmt(pmCut)}
):(
TBD
)
)}
Projects
{unhandled.length>0&&
;
})}
⚠ {unhandled.length} check{unhandled.length!==1?"s":""} not yet handed to you
}
{pendingDeposit.length>0&&
📥 {pendingDeposit.length} check{pendingDeposit.length!==1?"s":""} received — deposit to bank
}
{readySubs.length>0&&
⚠ {readySubs.length} sub{readySubs.length!==1?"s":""} ready to be paid
}
{title}{countStr}
Sub Total{fmt(sub)}
Tax ({f.taxRate}%){fmt(tax)}
Grand Total{fmt(grand)}
Your commission: {getPmPct("cory",true,splits)}% · Admin will verify before splitting.
}
{/* Header */}
setShowEdit(true)} color={N} sm outline>Edit
{/* Completion slider — always shown, gate unlock for active jobs */}
{setShowSubSheet(false);setEditSub(null);}}>
{
const u=editSub?{...project,subs:subs.map(x=>x.id===s.id?s:x)}:{...project,subs:[...subs,{...s,id:uid()}]};
upd(u);setShowSubSheet(false);setEditSub(null);
}}/>
}
{showEdit&&setShowEdit(false)}>
{upd({...project,...p});setShowEdit(false);}}
onDelete={()=>{onSave(projects.filter(x=>x.id!==project.id));onBack();}}/>
}
;
}
/* ── Add Check Row ── */
function AddCheckRow({state,taxRate,onAdd}){
const[amt,setAmt]=useState("");
const isWA=state==="WA"&&+taxRate>0;
const val=+amt||0, tax=isWA?val-val/(1+(+taxRate||0)/100):0, pre=val-tax;
const submit=()=>{if(!val)return;onAdd(val);setAmt("");};
return
{needsWeeklyUpdate&&!weeklyDone&&(
0||pmts.some(p=>!p.givenToAdmin)))?99:100}/>
{project.completionUpdatedAt&&(
{/* Everything below locked until weekly update done */}
⏰
)}
Daily update required
Update completion % daily to unlock this job
Last updated: {project.completionUpdatedAt}
)}
{balanceWarning&&
⚠️
}
{needsWeeklyUpdate&&!weeklyDone&&(
Can't mark 100% yet
{bal>0&&Balance due: {fmt(bal)} — collect full payment first
}
{pmts.some(p=>!p.givenToAdmin)&&Check all payments as "given to admin" first
}
Move the slider above to unlock all other sections
)}
{/* Financials */}
{!isAdmin&&gp!==0&&
}
;
})()}
}
{/* Split Done gate — admin only */}
{isAdmin&&project.status==="completed"&&project.paidInFull&&(()=>{
const unpaidSubs=(project.subs||[]).filter(s=>!s.payStatus||s.payStatus==="unpaid"||s.payStatus==="partial");
const subsAllPaid=unpaidSubs.length===0;
const allDeposited=pmts.length===0||pmts.every(p=>p.deposited);
const readyToSplit=subsAllPaid&&allDeposited;
return <>
}
{/* Project Completed toggle — PMs only, admin doesn't need it */}
{!isAdmin&&
{(()=>{
const noSubs=subs.length===0;
const pmBlocked=(bal>0||noSubs)&&project.status!=="completed";
return <>
}
{/* Customer Payments */}
{/* Checks list — always visible */}
{pmts.length>0&&}
{/* Running total */}
{/* Subs */}
{setEditSub(null);setShowSubSheet(true);}}>+ Add
{subs.length===0?
{/* end weekly gate wrapper */}
{showSubSheet&&Project Value
{fmt(project.value)}
Sub Costs
{fmt(cost)}
=0?`${GR}10`:`${RE}10`,borderRadius:8,display:"flex",justifyContent:"space-between",alignItems:"center"}}>
{project.status!=="completed"?"Current Gross Profit":"Final Gross Profit"}
=0?GR:RE}}>{fmt(gp)} ({pctf(gpPct)})
}
{isAdmin&&<>
{project.status!=="completed"?"Current Gross Profit":"Final Gross Profit"}
=0?GR:RE}}>
{fmt(gp)} ({pctf(gpPct)})
setShowOverride(v=>!v)} style={{display:"flex",justifyContent:"space-between",alignItems:"center",cursor:"pointer"}}>
{showOverride&&Override Splits
{[["PM %","pmPct"],["Mkt %","marketingPct"],["OH %","overheadPct"]].map(([lbl,key])=>(
))}
}
{lbl}
upd({...project,[key]:+e.target.value})}
onWheel={e=>e.target.blur()}
style={{width:"100%",padding:"6px 8px",borderRadius:7,border:`1px solid ${BD}`,fontFamily:"inherit",fontSize:13,fontWeight:700,color:N,background:W}}/>
{pmUser&&}
Paliy Net
{fmt(netPaliy)}
{project.state==="WA"&&<>Sales Tax
Transfer to Tax Account
{fmt(taxCollected-taxPaidSubs)}
}
:
Final split amounts will show once job is paid in full and all subs are marked paid
{project.state==="WA"&&(()=>{const tc=pmts.reduce((s,p)=>s+(p.tax||0),0);return tc>0?
Tax collected so far
{fmt(tc)}
:null;})()}
⚠ Cannot split yet
{unpaidSubs.length} sub/material{unpaidSubs.length!==1?"s":""} still unpaid or partial:
{unpaidSubs.map(s=>
· {s.nickname?`${s.company} (${s.nickname})`:s.company} — {s.payStatus==="partial"?"Partial":"Unpaid"}
)}
⚠ Mark all checks as deposited first
{pmts.filter(p=>!p.deposited).length} check{pmts.filter(p=>!p.deposited).length!==1?"s":""} not yet deposited
{pmUser?.username==="cory"&&project.attendedEst&&(
)}
;
})()}
{!isAdmin&&pmUser&&<>
⚠ Verify estimate with manager
Cory claimed he attended the estimate on this job (+{splits.pm_cory_bonus||5}% bonus = {project.pmPct||0}% total). Please confirm with the manager before splitting.
Job Split Completed
upd({...project,splitDone:v})} color={BL}/>
!pmBlocked&&onStatus(project.status!=="completed")}>
!pmBlocked&&onStatus(v)} color={BL}/>
{pmBlocked&&Project Completed
{bal>0&&
}
{project.completedDate&&Balance must be $0 before marking completed
}
{noSubs&&At least 1 sub or material must be added first
}
Completed: {project.completedDate}
}
;
})()}
Customer Payments
{project.paidInFull&&✓ Paid in Full}
{pmts.map((pmt,i)=>{
const showTax=project.state==="WA"&&(pmt.tax||0)>0;
const isDeposited=pmt.deposited||false;
const isGiven=pmt.givenToAdmin||false;
const toggleDeposit=()=>{const u=pmts.map(p=>p.id===pmt.id?{...p,deposited:!p.deposited}:p);upd({...project,payments:u});};
const toggleGiven=()=>{const u=pmts.map(p=>p.id===pmt.id?{...p,givenToAdmin:!p.givenToAdmin}:p);upd({...project,payments:u});};
return
}
{!isAdmin&&
}
;
})}
}
{/* Add check — only when not fully paid */}
{!project.paidInFull&&Check #{i+1} · {pmt.date}
{showTax&&Pre-tax: {fmt(pmt.amount-(pmt.tax||0))} · Tax: {fmt(pmt.tax||0)}
}
{isAdmin&&
{isDeposited&&✓}
{isDeposited?"Deposited":"Mark as deposited"}
{isGiven&&✓}
{isGiven?"Check given to admin":"Check given to admin?"}
{fmt(pmt.amount)}
{(!project.paidInFull&&(isAdmin||!isDeposited))&&}
Total Received{fmt(totalPaid)}
{!project.paidInFull&&Balance Remaining0?RE:GR}}>{fmt(bal)}
}
Subcontractors / Materials
{subs.map((s,i)=>{
const stax=s.inclTax?(s.cost*(s.taxRate||0))/100:0;
const stot=(s.cost||0)+stax;
const dn=s.nickname?`${s.company} (${s.nickname})`:s.company;
const toggleReady=()=>{
const updated=subs.map(x=>x.id===s.id?{...x,readyToPay:!x.readyToPay}:x);
upd({...project,subs:updated});
};
return
{!isDebit(s)&&(isAdmin||s.payStatus!=="paid")&&}
;
})}
}
{dn}
{s.desc&&{s.desc}
}
{isAdmin?(
<>
{s.payStatus==="paid"&&✓ Paid in Full}
{s.payStatus==="partial"&&Partial — {fmt(s.paidAmt)}}
{(!s.payStatus||s.payStatus==="unpaid")&&Unpaid}
{s.readyToPay&&s.payStatus!=="paid"&&· PM marked ready}
):(
isDebit(s)
? Card transaction
: s.payStatus==="paid"
? ✓ Paid in Full
:
)}
{s.readyToPay&&✓}
{s.readyToPay?"Sub Ready to be Paid in full!":"Sub Ready to be Paid in full?"}
{fmt(stot)}
{stax>0&&{fmt(s.cost)} + {fmt(stax)} ({s.taxRate}%) tax
}
Total
{fmt(cost)}
{isWA?`Add Check (includes ${taxRate}% tax)`:"Add Check Amount ($)"}
setAmt(e.target.value)} onWheel={e=>e.target.blur()} placeholder="0"
style={{flex:1,padding:"11px 14px",background:CR,border:`1.5px solid ${BD}`,borderRadius:10,fontFamily:"inherit",fontSize:15,color:N,outline:"none",boxSizing:"border-box"}}
onFocus={e=>e.target.style.borderColor=AC} onBlur={e=>e.target.style.borderColor=BD}
onKeyDown={e=>e.key==="Enter"&&submit()}/>
{isWA&&val>0&&
Pre-tax: {fmt(pre)}
Tax: {fmt(tax)}
}
No subcontractors saved yet. Add them in Settings first.
:}
Total
{fmt(tot)}
}
{isAdmin&&
{[["unpaid","Unpaid",RE],["paid","Paid",GR],["partial","Partial",AC]].map(([s,l,c])=>(
))}
Sub Total{fmt(sub)}
Tax ({f.taxRate}%){fmt(tax)}
Grand Total{fmt(grand)}
Profit Split Override
{(()=>{
const hasLocked=!isAdmin&&(
(project.payments||[]).some(p=>p.deposited)||
(project.subs||[]).some(s=>s.payStatus==="paid")
);
if(hasLocked) return setConfirmDel(true)}>Delete Project
:
setConfirmDel(false)}>Cancel
Yes, Delete
);
})()}
Job cannot be deleted — admin has confirmed payments or paid subs
;
return (isAdmin||project.status!=="completed")&&(!confirmDel
?Delete this project?
{l}
{v}
Reports
{/* Admin job status filter */}
{isAdmin&&Job Status
{[["done","Completed"],["split","Need to Split"],["ongoing","Ongoing"]].map(([v,l])=>(
))}
Year
{["all",...allYears].map(y=>)}
Month
{MONTHS.map((m,i)=>{const k=String(i+1).padStart(2,"0"),has=activeMos.includes(k);return ;})}
State
{[["both","Both States"],["WA","Washington"],["OR","Oregon"]].map(([v,l])=>)}
Showing:
{[yr==="all"?"All Time":yr,mo!=="all"?MONTHS[+mo-1]:null,st!=="both"?st:null].filter(Boolean).join(" · ")}
— {fil.length} job{fil.length!==1?"s":""}
{/* PM simplified stats */}
{!isAdmin&&<>
Paliy Net
After PM cuts, marketing & overhead
{fmt(paliyNet)}
Spending by Category
{Object.keys(bySub).length===0?No data.
:Object.entries(bySub).sort((a,b)=>b[1]-a[1]).map(([co,amt])=>{co}
{fmt(amt)}
{p.name}
{pm&&{pm.name}}
{p.completedDate&&{p.completedDate}}
=0?GR:RE}}>{fmt(pg)}
{pctf(pp)}
{title}
{jobs.length} job{jobs.length!==1?"s":""}
None
:jobs.sort((a,b)=>(b.completedDate||"").localeCompare(a.completedDate||"")).map(p=>Completed Jobs — {fil.length}
{fil.length===0?No completed jobs.
:[...fil].sort((a,b)=>(b.completedDate||"").localeCompare(a.completedDate||"")).map(p=>{
const pg=projBase(p)-projCost(p), pp=projBase(p)?(pg/projBase(p))*100:0;
const pmCut=(pg*(p.pmPct||0))/100;
return {p.name}
{fmt(pmCut)}
{pctf(pp)} GP
Settings
{tabs.map(([id,l])=>)}
{tab==="subs"&&Add Subcontractor / Material
{subCos.map((c,i)=>{
const name=typeof c==="string"?c:(c.company||""), nick=typeof c==="object"?(c.nickname||""):"";
return
;
})}
}
{name}
{nick&&{nick}
}Company Splits
PM Splits
{[{k:"pm_ivan",l:"Ivan %"},{k:"pm_yuriy",l:"Yuriy %"},{k:"pm_mark",l:"Mark %"},{k:"pm_cory",l:"Cory % (base)"},{k:"pm_cory_bonus",l:"Cory % (estimate bonus)"}].map(({k,l})=>(
setSp(s=>({...s,[k]:v}))} type="number" mb={0}/>
))}