<template>
    <lightning-card  title="CREATE NEW">
        
        <lightning-radio-group name="Create New"
            options={options} 
            value={value} 
            type="button" 
            onchange={handleChange} 
            class="slds-p-around_medium">
        </lightning-radio-group>
   
        <p class="slds-p-horizontal_small">
            <lightning-input class="inp" label={displayName} name="name" ></lightning-input>
            <lightning-input class="inp" type="tel" label="Contact Info" name="phone"></lightning-input>
        </p> 
        <template if:true={displayaccount}>
            <p class="slds-p-horizontal_small">
                <lightning-input class="inp" type="checkbox" label="Create Contact" name="CreateContact"></lightning-input>
            </p> 
        </template>
        <p slot="footer">     
            <lightning-button
                type="submit"
                name="submit"
                label={createaccount}
                onclick={handleClick}
                variant="brand">
            </lightning-button>
         </p> 
        
    </lightning-card>
</template>

import { LightningElement, track } from 'lwc';
import insertNewAccOrCon from '@salesforce/apex/AddAccOrCon.insertNewAccOrCon';

import {ShowToastEvent} from 'lightning/platformShowToastEvent';

export default class AccountOrContact extends LightningElement {
    @track displayaccount = true;
    @track Name;
    @track Phone;
    @track displayName = "Account Name";
    @track CreateContact = false;
    @track createaccount="Create Account";
    @track value = 'account';
    get options() {
        return [
            { label: 'Account', value: 'account' },
            { label: 'Contact', value: 'contact' },
        ];
    }
   
    handleChange(event){
        const selectedOption = event.detail.value;
        if(selectedOption =='account'){
            this.displayaccount = true;
            this.createaccount = "Create Account";
            this.displayName = "Account Name";
        }
        else{
                this.displayaccount = false;
                this.createaccount = "Create Contact";
                this.displayName = "Contact Name";
    }
    }

    handleClick(event)
    {
        console.log(event.target.label);
        var inp=this.template.querySelectorAll("lightning-input");
        
        inp.forEach(function(element){
            if(element.name=="name")
                this.Name = element.value;
            else if(element.name=="phone")
                    this.Phone = element.value;
                // else if(element.name=="CreateContact")
                        // this.CreateContact = element.value;
        },this);
        console.log("Name :" + this.name);
        console.log("Phone: "+this.phone);
        console.log("CreateContact Boolean: "+this.CreateContact);
        console.log("DisplayAccount : "+this.displayaccount);
        insertNewAccOrCon({name:this.name, 
            phone:this.phone, 
            createcontact: this.CreateContact, 
            displayAccButton:this.displayaccount}).then(result=>{
                console.log(JSON.stringify(result));
                const toastEvent = new ShowToastEvent({
                    title:'Success!',
                    message:'Account created successfully',
                    variant:'success'
                });
                this.dispatchEvent(toastEvent);
            }).catch(error=>{
                this.error=error.message;
             console.log(this.error);
            })
    } 
    
}

I have written a trigger on account to create or update contact. But there is something wrong with my trigger. When I am inserting the values, the same method is being called two times. 
What I am trying to do is:-
1) In the test class I am checking all the possible conditions for both the methods.

• First I make three accounts, two with Create_Contact__c value as true.
• For the account which has Create_Contact__c value as false, I want to check that there is no contact with same Accountid with the account in the list

trigger CreateContactOnAccount on Account (before insert,after insert, before update, after update) {
    if(Trigger.isBefore && Trigger.isInsert){
        system.debug('"Testing "');
         List<Contact> addCon = new List<Contact>();
    	 for(Account acc : trigger.new){
            if(acc.Create_Contact__c == true){
                Contact cons = new Contact(Lastname = acc.Name,
                	AccountId = acc.id,
            		Fax = acc.Fax,
            		Phone = acc.Phone,
            		MailingStreet = acc.BillingStreet,
            		MailingCity = acc.BillingCity,
            		MailingCountry = acc.BillingCountry,
                    MailingPostalCode=acc.BillingPostalCode);
            	addCon.add(cons);
            }
        }
        insert addCon;
    }
    if(Trigger.isupdate && Trigger.isAfter){
        system.debug('Testing updatingaccount ');
        set<id> getaccountid =new set<id>(); //to get the accountid which is updating
        for(account account : trigger.new){
        	getaccountid.add(account.id);
   			list<contact> contactlist = [SELECT id, accountid FROM contact WHERE accountid =:getaccountid]; //gets the contact with same accountid
    		List<Contact> addCon = new List<Contact>();
    		for(Contact cons : contactlist){
        		Account acc = Trigger.newmap.get(cons.accountid);
            	cons.Lastname = account.Name;
            	cons.Fax = account.Fax;
            	cons.Phone = account.Phone;
            	cons.MailingStreet = account.BillingStreet;
            	cons.MailingCity = account.BillingCity;
            	cons.MailingCountry = account.BillingCountry;
            	addCon.add(cons);
       	 	}
        	update addCon;
    	}
    }
}

@isTest
public class CreateContactOnAccountTest {
	 @istest static void validateCreateContact(){
        
        Account acc = new Account();
		acc.Name='Test Account' ;
        acc.Phone= '7868754543';
		acc.Create_Contact__c = true;
	
        Account acc1 = new Account();
		acc1.Name='Test Account 1' ;
        acc1.Phone= '7868754543';
		acc1.Create_Contact__c = false;
        
        Account acc2 = new Account();
		acc2.Name='Test Account 2' ;
        acc2.Phone= '7868754543';
		acc2.Create_Contact__c = true;
         
		Test.startTest();
        insert acc;
        insert acc1;
        insert acc2;
        Test.stopTest();
        
         list<contact> contactlist = [SELECT Id, Name,Phone, AccountId FROM contact ];
         System.debug(contactlist);
         System.debug(contactlist.size());
         System.assertEquals('Test Account', contactlist[0].Name);
    } 
    @isTest static void validateUpdateContacts(){
        Account acc = new Account();
        acc.Name='Test Account' ;
        acc.Phone= '7868754543';
        insert acc;
        
        acc.Create_Contact__c = true;
        acc.Fax = '767653656';
        acc.BillingCity = 'New Delhi';
        update acc;
        
        list<contact> contactlist = [SELECT Id, Name,Phone, AccountId, Fax, MailingCity FROM contact WHERE AccountId =: acc.id];
        System.debug(contactlist[0]);
        System.assertEquals('Test Account', contactlist[0].Name);
         System.assertEquals('767653656', contactlist[0].Fax);
        System.assertEquals('New Delhi', contactlist[0].MailingCity);
    }
}

<template>
    <lightning-card  title="CREATE NEW">
        <lightning-radio-group name="Create New" options={options}
value={value} type="button" onchange={handleChange}>
        </lightning-radio-group>
        <template if:true={value1}>
            <div class="slds-m-around_small">
                <lightning-record-edit-form 
                    onsuccess={handleSuccess}>
                    <lightning-input-field field-name="Name" name="name" ></lightning-input-field>
                    <lightning-input type="tel" label="Contact Info" name="phone3"></lightning-input> 
                    <lightning-input type="checkbox" label="Create Contact" name="CreateContact"></lightning-input>
                    <lightning-button
                        type="submit"
                        name="submit"
                        label="Create Account"
                        onclick={handleClick}
                        variant="brand">
                    </lightning-button>
            </lightning-record-edit-form>
            </div>
        </template>
        <template if:true={value2}> 
            <div class="slds-m-vertical_medium">
                <lightning-record-edit-form 
                    onsuccess={handleSuccess}>
                    <lightning-input-field field-name="Name" name="name" ></lightning-input-field>
                    <lightning-input-field field-name="Contact Info" name="phone" ></lightning-input-field>
                    <lightning-button
                        type="submit"
                        name="submit"
                        label="Create Contact"
                        onclick={handleClick}
                        variant="brand">
                    </lightning-button>
            </lightning-record-edit-form> 
            </div>
        </template>
    </lightning-card>
</template>

import { LightningElement, track, api } from 'lwc';
export default class AccountOrContact extends LightningElement {
    @track optionSelected;


    value = 'account';
    getSelection(event) {
        this.optionSelected = event.detail.value;
    }
    get value1(){return this.optionSelected == 'Account'}
    get value2(){return this.optionSelected == 'Contact'}


    get options() {
        return [
            { label: 'Account', value: 'value1' },
            { label: 'Contact', value: 'value2' },
        ];
    }
}

On the home page of Sales, I want to have a LWC card. I want to use that LWC card to create either Account or Contact as required by the user.  It should contain two radio button :
1) Create an account
2) Create a contact
Initially 'Create an account' should be pre-selected. It should display the form for user details like Name, Phone, address, etc.
When the user selects 'Create a Contact'  radio button, the card should display details to create contact.

My Question is which LWC component should I use to change the UI when different radio button is selected.

• If the checkbox (Create_Contact__c) while creating account is marked create contact wih same details.
• If the checkbox is not marked create only account.

• If the user is updating the contact which has a related contact, update with the details added.

trigger CreateContactOnAccount on Account (before insert,after insert, before update, after update) {
    if(Trigger.isBefore || Trigger.isInsert){
         List<Contact> addCon = new List<Contact>();
    	 for(Account acc : trigger.new){
            if(acc.Create_Contact__c == true){
                Contact cons = new Contact(Lastname = acc.Name,
                	AccountId = acc.id,
            		Fax = acc.Fax,
            		Phone = acc.Phone,
            		MailingStreet = acc.BillingStreet,
            		MailingCity = acc.BillingCity,
            		MailingCountry = acc.BillingCountry,
                    MailingPostalCode=acc.BillingPostalCode);
            	addCon.add(cons);
            }
        }
        insert addCon;
    }
    if(Trigger.isupdate && Trigger.isAfter){
        set<id> getaccountid =new set<id>(); //to get the accountid which is updating
        for(account account : trigger.new){
        	getaccountid.add(account.id);
   			list<contact> contactlist = [SELECT id, accountid FROM contact WHERE accountid =:getaccountid]; //gets the contact with same accountid
    		List<Contact> addCon = new List<Contact>();
    		for(Contact cons : contactlist){
        		Account acc = Trigger.newmap.get(cons.accountid);
            	cons.Lastname = account.Name;
        		//cons.AccountId = account.id;
            	cons.Fax = account.Fax;
            	cons.Phone = account.Phone;
            	cons.MailingStreet = account.BillingStreet;
            	cons.MailingCity = account.BillingCity;
            	cons.MailingCountry = account.BillingCountry;
            	addCon.add(cons);
       	 	}
        	update addCon;
    	}
    }
}

@isTest
public class CreateContactOnAccountTest {
	 @istest static void validateCreateContact(){
        
        Account acc = new Account();
		acc.Name='Test Account' ;
        acc.Phone= '7868754543';
		acc.Create_Contact__c = true;
	
		Test.startTest();
        insert acc;
        system.debug(acc.id);
        Test.stopTest();
        
         list<contact> contactlist = [SELECT Id, Name,Phone, AccountId FROM contact WHERE AccountId =: acc.id];
         System.debug(contactlist[0]);
         System.assertEquals('Test Account', contactlist[0].Name);
    } 
    @isTest static void validateUpdateContacts(){
		Account accnew = new Account();
		accnew.Name = 'Test Account 2';
        accnew.Phone = '76776537265';
       	insert accnew;
        
        accnew.Fax = '767653656';
        accnew.BillingCity = 'New Delhi';
        
        Test.startTest();
        update accnew;
        Test.stopTest();
        
        list<contact> contlist = [SELECT Id, Name,Phone, AccountId, Fax, MailingCity FROM contact WHERE AccountId =: accnew.id];
        System.debug(contlist[0]);
        System.assertEquals('767653656', contlist[0].Fax);
        System.assertEquals('New Delhi', contlist[0].MailingCity);
    }
}

public with sharing class AddAccount {
    @AuraEnabled
    public static Account insertNewAccount(String accountName){
        Account newAccount = new Account();
        newAccount.Name = accountName;
        try{
            insert newAccount;
            return newAccount;
        }
        catch(Exception d){
            return null;
        }
    }
}

trigger CreateContact on Account (after insert, after update, before insert) {
    if(Trigger.isupdate && Trigger.isAfter){
        set<id> getaccountid =new set<id>();
        for(account acc : trigger.new){
        getaccountid.add(acc.id);
        system.debug(acc.id);
    }
    list<contact> conlist = [SELECT id, accountid from contact where accountid in:getaccountid];
    List<Contact> addCon = new List<Contact>();
    for(Contact cons : conlist){
        Account acc = Trigger.newmap.get(cons.accountid);
            cons.Lastname = acc.Name;
            cons.Fax = acc.Fax;
            cons.Phone = acc.Phone;
        	//cons.Email = acc.Email;
            cons.MailingStreet = acc.BillingStreet;
            cons.MailingCity = acc.BillingCity;
            cons.MailingCountry = acc.BillingCountry;
            addCon.add(cons);
        }
        update addCon;
    }
    if(Trigger.isinsert && Trigger.isbefore){
        List<Contact> addCon = new List<Contact>();
    	for(Account acc : trigger.new){
        //Account acc = Trigger.newmap.get(cons.accountid);
            if(acc.Create_Contact__c == true){
                Contact cons = new Contact();
            	cons.Lastname = acc.Name;
            	cons.Fax = acc.Fax;
            	cons.Phone = acc.Phone;
            	cons.MailingStreet = acc.BillingStreet;
            	cons.MailingCity = acc.BillingCity;
            	cons.MailingCountry = acc.BillingCountry;
            	addCon.add(cons);
            }
        }
        insert addCon;
    }
}

<template>
    <lightning-card  title="Create your Account">
        <p class="slds-p-horizontal_small">
            <lightning-record-edit-form 
                object-api-name="Account" 
                onsuccess={handleSuccess}>
                <lightning-input-field field-name="Name" name="name"> 
                </lightning-input-field>            
            </lightning-record-edit-form>
        </p>
        <p slot="footer">
            <lightning-button
                type="submit"
                name="submit"
                label="Create Account"
                onclick={handleClick}>
            </lightning-button>
        </p>
    </lightning-card>
</template>

import { LightningElement, track, api, wire } from 'lwc';
import insertNewAccount from '@salesforce/apex/AddAccount.insertNewAccount';
export default class AddAccount extends LightningElement {
    @track Name;
    handleClick(event)
    {
        console.log(event.target.label);
        var inp=this.template.querySelector("lightning-input-field");
        this.Name=inp.value;
        console.log(inp.value);
        insertNewAccount("accountName:this.Name").then(result=>{
            console.log(JSON.stringify(result));
        }).catch(error=>{
            console.log(error);
        })
    } 
}

public with sharing class AddAccount {
    @AuraEnabled
    public static Account insertNewAccount(String accountName){
        Account newAccount = new Account();
        newAccount.Name = accountName;
        insert newAccount;
        return newAccount;
    }
}