import streamlit as st
import streamlit.components.v1 as components

def render_mermaid(graph):
    components.html(
        f"""
        <pre class="mermaid">
        {graph}
        </pre>
        <script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
        <script>mermaid.initialize({{startOnLoad:true}});</script>
        """,
        height=500,
    )

st.set_page_config(page_title="Azure Setup Guide", layout="wide")

st.title("Azure Two-Subscription Solution Setup Guide")

st.header("Architecture Overview")

mermaid_diagram = """
graph TB
    subgraph "Subscription 1"
        AI[AI Service]
        NSG1[Network Security Group]
    end

    subgraph "Subscription 2"
        FW[Azure Firewall]
        VNET[Virtual Network]
        NSG2[Network Security Group]
        ACR[Azure Container Registry]
        ACAE[Azure Container Apps Environment]
        subgraph "Container Apps"
            ACA1[AI App 1 with UI]
            ACA2[AI App 2 with UI]
            ACA3[AI App 3 with UI]
            ACA4[AI App 4 with UI]
        end
        AD[Azure Active Directory]
        APIM[API Management]
    end

    User((User)) -->|1. Access| FW
    FW -->|2. Route| APIM
    APIM -->|3. Redirect| AD
    AD -->|4. Authenticate| User
    User -->|5. Token| APIM
    APIM -->|6. Authorized Request| NSG2
    NSG2 --> ACAE
    ACAE -->|Egress| FW
    FW -->|Filtered Egress| AI
    NSG1 -->|Allows| FW
    ACR --> ACAE
"""

render_mermaid(mermaid_diagram)

st.header("Configuration Steps")

resources = {
    "Azure Firewall": {
        "description": "Configure inbound NAT rules and set up application and network rules.",
        "code": """
az network firewall application-rule create --collection-name 'Azure_AD' --firewall-name 'myFirewall' --name 'Allow_AzureAD' --protocols 'http=80' 'https=443' --resource-group 'myResourceGroup' --target-fqdns 'login.microsoftonline.com' 'graph.microsoft.com' --source-addresses '*' --action 'Allow' --priority 100
"""
    },
    "API Management": {
        "description": "Set up to handle incoming requests and manage authentication.",
        "code": """
<policies>
  <inbound>
    <validate-jwt header-name="Authorization" failed-validation-httpcode="401" failed-validation-error-message="Unauthorized">
      <openid-config url="https://login.microsoftonline.com/<tenant-id>/.well-known/openid-configuration" />
      <audiences>
        <audience>your-app-id-uri</audience>
      </audiences>
    </validate-jwt>
  </inbound>
</policies>
"""
    },
    "Azure Active Directory": {
        "description": "Register your application and configure app roles if needed.",
        "code": """
az ad app create --display-name "MyACAApp" --web-redirect-uris "https://myapim.azure-api.net/oauth2/callback"
"""
    },
    "Azure Container Apps Environment": {
        "description": "Enable authentication and set it to use Azure AD.",
        "code": """
az containerapp auth update --name myapp --resource-group myResourceGroup --enable-authentication true --provider microsoft --client-id <client-id> --client-secret <client-secret>
"""
    },
    "Network Security Group (NSG2)": {
        "description": "Configure to allow inbound traffic from APIM to ACAE.",
        "code": """
az network nsg rule create --name AllowAPIM --nsg-name myNSG --priority 100 --source-address-prefixes 'ApiManagement' --source-port-ranges '*' --destination-address-prefixes '*' --destination-port-ranges 443 --access Allow --protocol Tcp --description "Allow APIM inbound traffic"
"""
    },
    "Virtual Network (VNET)": {
        "description": "Ensure APIM, ACAE, and Azure Firewall are in the same VNET.",
        "code": """
az network vnet subnet create --name apim --resource-group myResourceGroup --vnet-name myVNet --address-prefixes 10.0.1.0/24
az network vnet subnet create --name acae --resource-group myResourceGroup --vnet-name myVNet --address-prefixes 10.0.2.0/24
"""
    },
    "Azure Container Registry (ACR)": {
        "description": "Configure with private endpoints for secure access from ACAE.",
        "code": """
az acr private-endpoint-connection create --name myACR --resource-group myResourceGroup
"""
    },
    "Network Security Group (NSG1)": {
        "description": "Update to allow traffic from Subscription 2's Azure Firewall IP.",
        "code": """
az network nsg rule create --name AllowSubnet2Firewall --nsg-name myNSG1 --priority 100 --source-address-prefixes '<Firewall-IP>' --destination-port-ranges '*' --access Allow --protocol '*'
"""
    }
}

for resource, details in resources.items():
    st.subheader(resource)
    st.write(details["description"])
    st.code(details["code"], language="bash")

st.header("Authentication Flow")
auth_flow = """
1. User attempts to access an ACA app URL
2. Azure Firewall routes the request to API Management
3. APIM redirects the user to Azure AD login page
4. User authenticates with Azure AD
5. Azure AD sends a token back to the user's browser
6. Browser sends the token to APIM
7. APIM validates the token and, if valid, forwards the request to the appropriate ACA app
8. ACA app processes the request and sends the response back through APIM and Azure Firewall to the user
"""
st.write(auth_flow)

st.header("Deploying New Apps using Azure Resources Extension in VS Code")
vscode_instructions = """
1. Install the Azure Resources extension in VS Code
2. Sign in to your Azure account in VS Code
3. Open the Azure Resources view in the sidebar
4. Right-click on your Container Apps Environment and select "Create Container App"
5. Follow the prompts to configure your new app:
   - Choose a name for your app
   - Select the appropriate container image
   - Configure environment variables if needed
   - Set up ingress rules
6. Review and create the new Container App
7. Once deployed, update the app's authentication settings using the Azure CLI command provided earlier
8. Update API Management to route traffic to the new app if necessary
"""
st.write(vscode_instructions)

st.header("Final Notes")
st.write("""
- Ensure all resources are properly secured and follow Azure best practices
- Regularly update and patch all components
- Monitor your applications and infrastructure using Azure Monitor
- Implement proper logging and alerting mechanisms
- Conduct regular security audits and penetration testing
""")