Hi MSantana, I took a quick look at your code but I am not sure it can work, well, at least with the code you sent, the extension in your Visualforce Page is "VFP_CustomConsoleComponentCtrl" and your controller name is "CaseConsoleControllerExt". 

In any case, I copy your code to my environment and had to modify it a bit because I couldn't even save it, it general I just made some minor changes and it worked. 

In reference to your concerns about what's the best way to do it, well, it depends on your requirements in terms of security, accessibility, process flow, environment (Classic/Lightning Experience), etc. 

I am adding a couple of screenshots to confirm with you, at least, a part of your requirements:

In the first screenshot, I selected a case and clicked on the bottom console button to open the popup screen. You can see the data of the case in the Primary Tab is displayed in the popup screen:


Then, I clicked on a second case. My code doesn't close the popup window but just refresh the data in it:


If that's what you want as behavior, this is the code:
-Visualforce Page

<apex:page StandardController="Case" Extensions="CaseConsoleControllerExt" showHeader="false" sidebar="false">
    <apex:includeScript value="/support/console/42.0/integration.js"/>
    <script type="text/javascript">
        if(sforce.console){

            var redrawForm = function (result) {
            
                assignVar(result.objectId);
               
            }    



            function GetPrimaryTabObjectId() {
                sforce.console.getFocusedPrimaryTabObjectId(showObjectId);
                }
            var showObjectId = function showObjectId(result) {
                //Display the object ID
                assignVar(result.id);
                alert('Object ID: '+result.id);
            };
            var closewidget= function (result) {
                sforce.console.setCustomConsoleComponentVisible(false);
            };
            function refreshFocusTabId(id) 
            {
            if (sforce.console.isInConsole())
                sforce.console.getFocusedPrimaryTabId(showTabId);                
            else
                window.top.location.href = '/' + id;
            }

            var showTabId = function showTabId(result) 
            {
                var tabId = result.id;
                alert(tabId);
                sforce.console.refreshPrimaryTabById(tabId , true);
            };
            sforce.console.onCustomConsoleComponentButtonClicked(GetPrimaryTabObjectId);
            sforce.console.onFocusedPrimaryTab(redrawForm);
        }
    </script>
    <apex:form id="frm">
        <apex:actionFunction name="assignVar" rerender="frm" action="{!returnVar}">
                <apex:param name="cid" value="" assignTo="{!consoleId}"/>
        </apex:actionFunction><br/><br/>
        Case Number : {!c.CaseNumber}<br/><br/>
        Case Status : {!c.Status}<br/><br/>
        Case Subject : <apex:inputField value="{!c.Subject}" /><br/><br/>
        <center><apex:commandButton value="Update Case" action="{!updateCase}" onComplete="refreshFocusTabId('{!consoleId}')"/> </center>
    </apex:form>    
</apex:page>

-Controller:

public with sharing class CaseConsoleControllerExt {
   public Id consoleId { get; set;}
   public Case c{get;set;}
   public void returnVar() {// This is where you get the param sent from the VF page
        System.debug('consoleId ' + consoleId);
        c = new Case();
        c = [Select Id,CaseNumber,Subject,Case_Subject__c,Status from Case where id =: consoleId];

   }
  public CaseConsoleControllerExt(ApexPages.StandardController controller) {
        // Do thonthing here
        System.debug('##### In constructor ####');
        c = new Case();
  }
  public void updateCase() {
        update c;
  }
}

I modified just a bit of your code, that way you can continue from there.

Hope that helps. 
JL