component.py

import gradio as gr
import pandas as pd
import matplotlib
matplotlib.use("Agg")
import matplotlib.pyplot as plt
import inspect
import io


# style formating for Header
def header(input:str):
    """
    Usage:
        header('your text')
    Output: 
        <h1 class="header"> {input} <h1>
        output will be bold. use for container header only
    Args:
        input (str): _header_Title_
    """
    gr.Markdown(f"# {input}", elem_classes='header')

# style formating for Header2
def h2(input:str):
    """
        Usage:
            h2('your text')
        Output: 
            <h2 class="subheader"> {input} <h2>
        output will be bold. use for optional
    Args:
        input (str): _subheader_Title_
    """
    gr.Markdown(f'<h2 class="subheader" style="black">{input}</h2>')

# style formating for Text
def p(input:str):
    """
    Usage:
        p('''
            text <br>
            text
        ''')
        
        or
        
        p('text')
    Outputs:
        Multiple <p class="desc">...</p> blocks, one per paragraph.
    """
    paragraphs = input.strip().split("<br>")
    text = ''.join(f'<p class="desc">{para.strip()}</p>' for para in paragraphs if para.strip())
    return gr.Markdown(text)

# this for displaying dataframe and also provied downlaod csv
def Dataset(df,title, source, key=None):
    """
    Creates a reusable dataset display component.
    This is displaying title, dataframe, and provide download button
    file path means file 
    Args:
        df (pd.DataFrame): Dataset to display
        title (str): Title for the dataset display
        file_path (str): Path to the CSV file for download (the file name following the path)
        key (str): Optional unique identifier for Gradio components
    """
    def get_file():
        return source

    with gr.Column(elem_classes='dataframe-layout', elem_id=f"dataset-{key}" if key else None):
        # Title and download button in a row
        with gr.Row():
            gr.Markdown(f'<h1 class="subtitle">{title}</h1>') # title formating
            download_btn = gr.DownloadButton(
                label="Download CSV",
                value=get_file,
                elem_id=f"download-{key}" if key else None
            )
        
        # Dataframe display
    df_display=gr.Dataframe(
        value=df.head(100),
        headers=list(df.columns),
        elem_id=f"table-{key}" if key else None,
        interactive=False,    # read only
        # disable the warp for reduce height of data
        # wrap=True 
    )
    return df_display

def describe_value_counts(series):
    description = series.describe().to_frame(name='value')
    description = description.reset_index()                       # Move index (stat name) into column
    description.columns = ['Statistic', 'Value']     
    return description

# this is for EDA, preprocess
def plot_distribution(df, column):
    """
    Generates a matplotlib plot (bar chart or histogram) showing the distribution 
    of values in a selected column from the dataframe.

    Parameters:
    -----------
    df : pd.DataFrame
        The dataframe to plot from.
    column : str
        The column name to visualize.

    Returns:
    --------
    matplotlib.figure.Figure
        A figure object representing the distribution plot.
    """
    fig, ax = plt.subplots(figsize=(10, 5))
    
    if df[column].dtype == 'object' or df[column].nunique() < 20:
        # Bar plot for categorical/small unique values
        value_counts = df[column].value_counts().head(20)
        ax.bar(value_counts.index, value_counts.values)
        ax.set_xticklabels(value_counts.index, rotation=45, ha='right')
        ax.set_ylabel('Count')
        ax.set_title(f'Distribution of {column}')
    else:
        # Histogram for numerical
        ax.hist(df[column].dropna(), bins=100, edgecolor='black')
        ax.set_title(f'Distribution of {column}')
        ax.set_xlabel(column)
        ax.set_ylabel('Frequency')

    fig.tight_layout()
    return fig

## this is for eda, preprocess, and training
def code_cell(code):
    """
        simply syntax for gr.code
    Usage :
        Code_cell('df = pd.read_csv(path)')
    or 
        using triple string for multiple line
        code_cell("""""")
    """
    gr.Code(inspect.cleandoc(code), language='python')

## This for EDA, Preprocess, and training
def plot_training_results(results: dict):
    """
    Plots the training metrics: merror and mlogloss from the result dictionary.

    This function generates a line plot that visualizes the model's training 
    performance over time (e.g., across epochs or folds), using the merror 
    (training error) and mlogloss (log loss) values.

    Args:
        results (dict): A dictionary containing two keys:
            - 'merror': list of training error values.
            - 'mlogloss': list of log loss values.
            Example:
                {
                    "merror": [0.12, 0.10, 0.08],
                    "mlogloss": [0.35, 0.32, 0.30]
                }

    Returns:
        matplotlib.figure.Figure: A Matplotlib figure showing the trends of 
        training error and log loss as line plots.

    Example:
        results = {
            "merror": [0.12, 0.10, 0.08],
            "mlogloss": [0.35, 0.32, 0.30]
        }
        plot_output = gr.Plot()
        btn = gr.Button("Generate Plot")
        btn.click(fn=lambda:plot_training_results(results), inputs=[], outputs=plot_output, preprocess=False)
    """
    epochs = list(range(1, len(results["merror"]) + 1))

    plt.figure(figsize=(8, 5))
    plt.plot(epochs, results["merror"], marker='o', label='Training Error (merror)', color='blue')
    plt.plot(epochs, results["mlogloss"], marker='s', label='Log Loss (mlogloss)', color='orange')

    plt.title('Training Metrics Over Time')
    plt.xlabel('Epoch / Fold')
    plt.ylabel('Value')
    plt.legend()
    plt.grid(True)
    plt.tight_layout()

    return plt.gcf()

# for Recommendation section
def input_name_textbox(Label:str, Placeholder:str):
    """
    usage:
        app_name = input_name_textbox('Input Your App', 'Enter game title...')
    Args:
        Label (str): Title textbox
        Placeholder (str): placeholder text

    Returns:
        variable : str
    """

    inputbox = gr.Textbox(
        label=Label,
        placeholder=Placeholder,
        elem_classes="text-input"
    )
    return inputbox

def input_number(Label:str,Precision = 0,**kwargs):
    """
    usage:
        app_name = input_number('Input Number', 'Enter game number...')
    Args:
        Label (str): Title textbox
        Placeholder (str): placeholder text

    Returns:
        variable : str
    """

    inputbox = gr.Number(
        label=Label,
        elem_classes="text-input",
        precision=Precision,
        **kwargs
    )
    return inputbox

def input_paragaph_textbox(Label:str, Placeholder:str):
    """
    usage:
        paragraph = input_paragaph_textbox('Your Story', 'Type your text...')
    Args:
        Label (str): Title textbox
        Placeholder (str): placeholder text

    Returns:
        variable : str
    """
    paragraph = gr.Textbox(
            label=Label,
            placeholder=Placeholder,
            lines=5,
            max_lines=8,
            max_length=1200,
            elem_classes="text-input"
        )
    return paragraph

def input_choice(Label:str, Choices:list, Multiselect:bool):
    """Allow user to select choices\n
        Multiselect True for multiple choices\n
        Multiselect False for single choices\n
    Usage:\n
        genre = gr.Dropdown(\n
            label="Select Your Genre (Multiple Choice)",\n
            choices=[\n
                'Action', 'Adventure', 'RPG', 'Strategy', 'Simulation',\n
                'Casual', 'Indie', 'Sports', 'Racing', 'Fighting',\n
                'Puzzle', 'Shooter', 'Platformer', 'MMO', 'Horror',\n
                'Survival', 'Open World', 'Visual Novel', 'Point & Click',\n
                'Sandbox', 'Metroidvania', 'Tactical', 'Rhythm',\n
                'Stealth', 'Rogue-like', 'Rogue-lite'\n
            ],\n
            multiselect=True,\n
            value=[],\n
            elem_classes="dropdown"\n
        )\n
    
    or only single choice \n
    
        price_range_input = gr.Dropdown(\n
            label="Select Your Price Range (Only Single Choice)",\n
            choices=[\n
                'Free',\n
                '5$ - 10%',\n
                '10$ - 50%',\n
                '50$ - 100%',\n
                '100$ - 500%',\n
                'above 500%',\n
            ],
            multiselect=False,\n
            value=[],\n
            elem_classes="dropdown"\n
        )\n
    Args:\n
        Label (str): _description_\n
        Choices (list): _description_\n
    """
    multiple_choice = gr.Dropdown(
        label=Label,
        choices=Choices,
        multiselect=Multiselect, # True Allowing multi select
        value=[] if Multiselect else None, # the choosen value will be passed here
        elem_classes="dropdown"
    )
    return multiple_choice