Open Modal Popup on button click using Lightning Component

public class OpenModelPopup{
    public static Map<Id, String> recordtypemap {get;set;}
    
    @AuraEnabled        
    public static List<String> fetchRecordTypeValues(){
        List<Schema.RecordTypeInfo> recordtypes = Account.SObjectType.getDescribe().getRecordTypeInfos();    
        recordtypemap = new Map<Id, String>();
        for(RecordTypeInfo rt : recordtypes){
            if(rt.getName() != 'Master')
                recordtypemap.put(rt.getRecordTypeId(), rt.getName());
        }        
        return recordtypemap.values();
    }    
}

<aura:component controller='OpenModelPopup' implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
    <aura:attribute name="openmodel" type="boolean"/>
    <aura:attribute name="selectedLookUpRecord" type="sObject" default="{}"/>
    <aura:handler name="init" value="{!this}" action="{!c.fetchListOfRecordTypes}"/>
    <aura:attribute name="lstOfRecordType" type="String[]" />
    
    <lightning:button label="Click Me" variant="neutral" onclick="{!c.PerformAction}" />
    
    <aura:If isTrue="{!v.openmodel}">
        <div aura:id="editDialog" role="dialog" tabindex="-1" aria-labelledby="header43" class="slds-modal slds-fade-in-open slds-modal_small slds-backdrop ">
            <div class="slds-modal__container ">
                <div class="slds-modal__header">
                    <h2 class="slds-text-heading--medium">Modal Popup with button click</h2>
                    <button class="slds-button slds-modal__close slds-button--icon" title="Close" onclick="{!c.closeModal}">
                        <lightning:icon iconName="utility:close" size="medium" />
                        <span class="slds-assistive-text">Close</span>
                    </button>
                </div>
                <div class="slds-modal__content slds-p-around--medium slds-grid slds-wrap " style="height:400px;" >
                    <!--  Write Your Content here  -->
                    <div class="slds-size--1-of-2 slds-large-size--1-of-2 ">
                        <div class="slds-text-heading_large slds-text-color_success ">
                            This is Salesforcecodes.com
                        </div>
                        <br/>
                    </div>
                </div>
            </div>
        </div>
    </aura:If>
</aura:component>

({
    PerformAction : function(component, event, helper) {
        component.set("v.openmodel",true);
    },
    closeModal:function(component,event,helper){    
        var cmpTarget = component.find('editDialog');
        var cmpBack = component.find('overlay');
        $A.util.removeClass(cmpBack,'slds-backdrop--open');
        $A.util.removeClass(cmpTarget, 'slds-fade-in-open');
        component.set('v.openmodel',false);
        
    },
    fetchListOfRecordTypes: function(component, event, helper) {
        var action = component.get("c.fetchRecordTypeValues");
        action.setCallback(this, function(response) {
            component.set("v.lstOfRecordType", response.getReturnValue());
        });
        $A.enqueueAction(action);
    },
})

<aura:application extends="force:slds" >
    <c:ModalPopupOpen/>
</aura:application>