React Jsx and JS file conditional

Ok so here's the deal I'm working in react and I got this website me and team are working on for a senior project.

So i've got this functioning login page with its code below called component.jsx its got all i need including text inputs for customers. however We want to add validation to it so that when the text is empty(like if a customer just forget and hit submit) it would send a message letting them know.

essentially Im asking for a conditional only issue is that jsx dosent rly do conditionals like IF/else

so I wanted to do it in a sepereate js file (validate.js) and I've looked everywhere I cant find anything about how to make an effective function/class or whatever for an input in a JS file then impart that into the jsx file where the code is.

So right now Im looking fr guidance on how to achieve that goal and was wondering if anybody had any ideas(websites with this, similar questions or just know the answer).

If you do just know the answer on how to do this please keep it simple that way I can look back at it latter to understand incase I miss you

currently the JS file(validate.js) I have is empty

login website JSX code