Credits display ready!!!

app.py

@@ -26,6 +26,8 @@ def authenticate(username, password):
             gr.State.tokens = sulkuPypi.getTokens(capsule)
             
             print(f"Tienes: {gr.State.tokens} tokens. ")
+            creditos = gr.State.tokens
+            print(f"Ésta es la cantidad guardada en creditos: {creditos}")
             
             return True
     #Si no hubo coincidencia regresas un false.    
@@ -98,9 +100,11 @@ def click_buy():
 
 def display_tokens():
 
-    print("Ejecutando display_tokens...")
+    print("Ejecutando display_tokens, tienes: ", gr.State.tokens)
 
-    return gr.State.tokens
+    display = tools.actualizar_creditos(gr.State.tokens)
+
+    return display
 
 #LOCAL VARIABLES
 # gr.State.usuario = "briggsboardman"
@@ -115,13 +119,10 @@ destination_image = gr.Image(label="Destination")
 
 #Outputs
 print("En éste momento estoy creando los outputs...")
-creditos = 999
+creditos = None 
 result_image = gr.Image(label="Blend Result")
 txt_credits = gr.Textbox(label="Credits Available", value="", interactive=False)
-html_credits = gr.HTML(f"""
-                       <div style="text-align: right;">💶<b>Credits Available:</b>{creditos}</div>
-                       """)
-
+html_credits = gr.HTML()
 lbl_console = gr.Label(label="AI Terminal Messages", value="AI Engine ready...", container=True)
 btn_buy = gr.Button("Buy More", visible=False, size='lg')
 #btn_buy.click(fn=click_buy, outputs=mrk_title)
@@ -136,7 +137,10 @@ btn_buy = gr.Button("Buy More", visible=False, size='lg')
 #valor = gr.State.tokens
 valor = ""
 
-with gr.Blocks(theme=gr.themes.Base(), css="footer {visibility: hidden}") as main:   
+with gr.Blocks(theme=gr.themes.Base(), css="footer {visibility: hidden}") as main:
+
+    #Función, input, output
+    main.load(display_tokens, None, html_credits )  
    
     with gr.Row():
 

tools.py

@@ -2,7 +2,7 @@
 def actualizar_creditos(nuevos_creditos):
 
      html_credits = f"""
-                       <div style="text-align: right;">💶<b>Credits Available:</b> {nuevos_creditos}</div>
+                       <div style="text-align: right;">💶<b>Credits Available: </b> {nuevos_creditos}</div>
                        """
      
      return html_credits