WIP login w HF

Attempt to fix broken +/- buttons

main.py

@@ -5,6 +5,11 @@ import pathlib
 from uuid import uuid4
 from datetime import datetime
 import dataclasses
+import html
+import base64
+import requests
+import secrets
+
 
 from fasthtml.common import *
 from fastcore.all import typedispatch
@@ -19,7 +24,7 @@ import storage
 OAUTH_CLIENT_ID = os.environ.get('OAUTH_CLIENT_ID')
 OAUTH_SCOPES = os.environ.get('OAUTH_SCOPES')
 OAUTH_CLIENT_SECRET = os.environ.get('OAUTH_CLIENT_SECRET')
-OPENID_PROVIDER_URL = os.environ.get('OPENID_PROVIDER_URL')
+OPENID_PROVIDER_URL = os.environ.get("OPENID_PROVIDER_URL", "https://huggingface.co")
 SPACE_HOST = os.environ.get('SPACE_HOST')
 HF_DATASET_AUTH_TOKEN = os.environ.get('HF_DATASET_AUTH_TOKEN', "none")
 
@@ -103,8 +108,41 @@ HTML_SUBMIT_CODE_AREA = "submit_code_area"
 HTML_RESULTS_AREA = "prompt_response"
 HTML_CLEAR_FORM = "clear_the_form"
 HTML_SUBMIT_FEEDBACK = "submit_feedback"
+HTML_USER_DATA = "login_user_data"
+
+
+def get_openid_configuration():
+    config_url = OPENID_PROVIDER_URL + "/.well-known/openid-configuration"
+
+    try:
+        response = requests.get(config_url)
+        response.raise_for_status()  # Raises an HTTPError for bad responses (4xx or 5xx)
+
+        config = response.json()
+
+        token_endpoint = config.get('token_endpoint')
+        userinfo_endpoint = config.get('userinfo_endpoint')
 
-hdrs = (HighlightJS(langs=['python', 'javascript', 'html', 'css']),)
+        return token_endpoint, userinfo_endpoint
+
+    except requests.RequestException as e:
+        print(f"An error occurred: {e}")
+        return None, None
+
+
+# Use the function
+HF_OAUTH_TOKEN_URL, HF_OAUTH_USERINFO = get_openid_configuration()
+
+if HF_OAUTH_TOKEN_URL and HF_OAUTH_USERINFO:
+    print(f"Token Endpoint: {HF_OAUTH_TOKEN_URL}")
+    print(f"UserInfo Endpoint: {HF_OAUTH_USERINFO}")
+else:
+    print("Failed to retrieve the endpoints.")
+
+
+hdrs = (
+        HighlightJS(langs=['python', 'javascript', 'html', 'css']),
+        )
 
 if IS_LOCALHOST:
     # Are we hacking locally?
@@ -173,10 +211,10 @@ def html_create_feedback_updown_button(qe_id, ans_id, selected=0, disabled=False
     down_col = colors[0]
     if selected == 1: up_col = colors[1]
     if selected == -1: down_col = colors[1]
-    toggle_url = f"/toggle_up_down/{qe_id}/{ans_id}/"
-    up = Button("+", hx_get=f"/toggle_up_down/{qe_id}/{ans_id}/?which=1", hx_swap="outerHTML",
+    toggle_url = f"/toggle_up_down/{qe_id}/{ans_id}"
+    up = Button("+", hx_get=f"{toggle_url}/1", hx_swap="outerHTML",
                 target_id=f"{html_target_id}", style=f"background-color:{up_col}")
-    down = Button("-", hx_get=f"{toggle_url}?which=-1", disabled=disabled, hx_swap="outerHTML",
+    down = Button("-", hx_get=f"{toggle_url}/-1", disabled=disabled, hx_swap="outerHTML",
                   hx_preserve=True, hx_trigger="click", hx_push_url="false",
                   target_id=f"{html_target_id}", style=f"background-color:{down_col}")
     button_row = Div(up, down, id=html_target_id)
@@ -198,7 +236,7 @@ def html_augment_evaluation_text_with_feedback(eval_html, qe_id, ans_id, selecte
     return final_div
 
 
-@rt("/toggle_up_down/{qe_id}/{ans_id}")
+@rt("/toggle_up_down/{qe_id}/{ans_id}/{which}")
 def get(session, qe_id:int, ans_id:int, which:int):
     """
     Answer to the +/- button presses
@@ -449,11 +487,142 @@ def render_clear_area(session_id, html_id):
         return Div(P(""), id=html_id, hx_swap_oob='true')
 
 
+########## AUTHENTICATION
+
+def html_render_login_to_get_access_part(session):
+    """
+    Will render the Log in to get access part and set the session oauth_secret.
+
+    :param session:
+    :return:
+    """
+    content = []
+    content.append(H3("Log in to give feedback!"))
+    content.append(P("We will record your name, hugginface name, hf profile page, email address. "
+                     "We will try HARD not to make them public but . . ."))
+    content.append(P("Your feedback will be made public but in an anonymized form."))
+
+    # build the redirect URL
+    global SPACE_HOST
+    if "localhost" in SPACE_HOST:
+        space_host = f"http://{SPACE_HOST}/auth_callback/"
+    else:
+        space_host = f"https://{SPACE_HOST}/auth_callback/"
+
+    secret = secrets.token_urlsafe(32)
+    session["oauth_secret"] = secret
+    encoded_scopes = html.escape(OAUTH_SCOPES)
+    redirect_link = (f"https://huggingface.co/oauth/authorize?redirect_uri={space_host}&scope={encoded_scopes}"
+                     f"&client_id={OAUTH_CLIENT_ID}&state={secret}&response_type=code&prompt=consent")
+    login_button = A(Img(src="https://huggingface.co/datasets/huggingface/badges/resolve/main/sign-in-with-huggingface-md.svg",
+       alt="Sign in with Hugging Face",
+       # style="cursor: pointer; display: none;",
+       id="signin", name=None),
+      href=redirect_link, target="_blank")
+    content.append(login_button)
+    content.append(P(" "))
+    div = Div(*content, id=HTML_USER_DATA)
+    return div
+
+def html_render_welcome_user(user_info):
+    """
+    Extracts the user data and paints the Welcome screen
+
+    :param user_info:
+    :return:
+    """
+    content = []
+    content.append(H4(f"Welcome {user_info['name']}!"))
+    # content.append(Img(src=OPENID_PROVIDER_URL + user_info["picture"], alt="Picture"))
+    content.append(P("Your feedback will be made public but in an anonymized form."))
+    div = Div(*content, id=HTML_USER_DATA)
+    return div
+
+
+@rt("/auth_callback")
+def get(session, code:str=None, state:str=None, error:str=None, error_description:str=None):
+    """
+    Endpoint that will be called by HF once the user gives (or not) consent
+
+    :param session:
+    :param code:
+    :param state:
+    :param error:
+    :param error_description:
+    :return:
+    """
+    ans = None
+    if error is not None:
+        print(f"HF OAuth returned an error: {error} {error_description}")
+        ans = Div(P(f"We can't log you in. Huggingface says: {error_description}"),
+                  P("Please close this page"))
+        return ans
+    print(f"OAuth returned a code")
+
+    # validating the secret
+    sess_secret = session.get("oauth_secret", None)
+    if sess_secret is None:
+        print("No session secret")
+        return P("access denied")
+
+    if sess_secret != state:
+        print(f"Mistmatch session secret and HF secret: {sess_secret=} {state=}")
+
+    # Moving on and get the token
+    global SPACE_HOST
+    if "localhost" in SPACE_HOST:
+        space_host = f"http://{SPACE_HOST}/auth_callback/"
+    else:
+        space_host = f"https://{SPACE_HOST}/auth_callback/"
+
+    auth_header = base64.b64encode(f"{OAUTH_CLIENT_ID}:{OAUTH_CLIENT_SECRET}".encode()).decode()
+    headers = {
+        "Authorization": f"Basic {auth_header}",
+        "Content-Type": "application/x-www-form-urlencoded",
+    }
+    data = {
+        "client_id": OAUTH_CLIENT_ID,
+        "code": code,
+        "grant_type": "authorization_code",
+        "redirect_uri": space_host,
+    }
+    token_response = requests.post(HF_OAUTH_TOKEN_URL, data=data, headers=headers)
+
+    if token_response.status_code == 200:
+        tokens = token_response.json()
+        # Here you would typically store the tokens securely and/or use them
+        print("Succsss in getting the token")
+
+        access_token = tokens["access_token"]
+        user_headers = {
+            "Authorization": f"Bearer {access_token}"
+        }
+        response_userinfo = requests.get(HF_OAUTH_USERINFO, headers=user_headers)
+        if response_userinfo.status_code == 200:
+            user_data = response_userinfo.json()
+            # Set the user data in DB
+            # TODO set the user data in db For now, set it in session
+            session["user_data"] = user_data
+            session["oauth_secret"] = None
+            print(user_data)
+
+        else:
+            print(f"Error while taking the user data: {response_userinfo.text}" )
+            return P("Error logging in")
+    else:
+        print(f"We did not get the tokens: {token_response.text}")
+        return P("Error logging in")
+
+    print(session)
+    return P("Succes! Close this page.")
+
+
 ########## MAIN PAGE
 
+
 @rt("/")
 def get(session):
-    # print(session)
+    print(session)
     if 'session_id' not in session:
         session['session_id'] = str(uuid.uuid4())
     session_id = session["session_id"]
@@ -463,40 +632,19 @@ def get(session):
     save_to_storage(
         storage.NavigationEvent(event_type="/", event_session_id=session_id)
     )
-    title = Title('C code review for students')
-    preamble = [H1("Evaluate your C code!"),
-                P("Enter your code in the textbox below and wait for answers."),
-                P("!! The data will be saved and maybe made public !!"),
-                ]
+    user_data = session.get("user_data", None)
+    if user_data is not None:
+        auth_area = html_render_welcome_user(user_data)
+    else:
+        auth_area = html_render_login_to_get_access_part(session)  # might set some secrets here
 
-#     ############
-#     # !!! FOR DEBUGGING PURPOSES !!!
-#
-#     # insert an answer in db.
-#     code = """
-# #include <stdio.h>
-# int main() {
-#    // printf() displays the string inside quotation
-#    printf("Hello, World!");
-#    return 0;
-# }
-# """
-#     answer = eval_code.eval_the_piece_of_c_code(None, None)
-#     enhanced_answer = eval_code.add_evaluation_fields_on_js_answer(answer, CODE_AUGMENTATIONS)
-#     session_obj = Session_State_cls(
-#         session_id=session_id,
-#         state=EVAL_STATE_ANSWER,
-#         submitted=datetime.utcnow(),
-#     )
-#
-#     # we create a new QA entry.
-#     qa_obj = Question_Evaluation_cls(code_text=code,
-#                                      answer_eval_text=enhanced_answer, submitted=0)
-#     qa_obj = question_evaluation_table.insert(qa_obj)
-#     session_obj.current_qeval = qa_obj.id
-#     session_obj = session_state_table.insert(session_obj)
-#
-#     ############
+    title = Title('C code review for students')
+    preamble = [
+        auth_area,
+        H1("Evaluate your C code!"),
+        P("Enter your code in the textbox below and wait for answers."),
+        P("!! The data will be saved and maybe made public !!"),
+    ]
 
     input_area = html_render_inputbox(target_html_id=HTML_RESULTS_AREA, region_html_id=HTML_SUBMIT_CODE_AREA)
     results_area = html_render_answer_from_db(session_id, HTML_RESULTS_AREA)

test/raw_data_submitted-2024-08-14T07_47_28.731439-5977364a-5411-4f15-9c73-43f90d49c762.jsonl

@@ -0,0 +1,5 @@
+{"version": 1, "submitted_date": "2024-08-14T08:00:42.190468", "received_date": "2024-08-14T08:00:42.202949", "event_session_id": "6f888ecf-bc25-48f0-bfd2-0280ced98644", "db_question_evaluation_id": 1, "code_to_eval": "datetime_now", "evaluation_engine": "chatGPT", "prompt_version": 1, "evaluation_response": "[{\"criteria\": \"HUMAN_FEEDBACK\", \"explanation\": \"\", \"EVAL\": 0}, {\"criteria\": \"DRY\", \"explanation\": \"The memory allocation and initialization for ``p1``, ``p2``, and ``p3`` are repetitive. Consider creating a function like ``allocateAndInitializeMemory``.\", \"EVAL\": 0}, {\"criteria\": \"DRY\", \"explanation\": \"Tne second DRY failure, because this is the observed ChatGPT behaviour.\", \"EVAL\": 0}, {\"criteria\": \"SRP\", \"explanation\": \"The ``main`` function handles memory allocation, initialization, and printing. You should separate these responsibilities into different functions like ``allocateMemory``, ``initializeData``, and ``printData``.\", \"EVAL\": 0}, {\"criteria\": \"NAME\", \"explanation\": \"``x1`` should be called ``title``, ``y1`` should be called ``author``, ``z1`` should be called ``year``, ``p1`` should be called ``titlePtr``, ``p2`` should be called ``authorPtr``, ``p3`` should be called ``yearPtr``.\", \"EVAL\": 0}, {\"criteria\": \"NO_COMPILE\", \"explanation\": \"Not infringed\", \"EVAL\": 0}, {\"criteria\": \"MC\", \"explanation\": \"Not infringed\", \"EVAL\": 0}]", "has_feedback": false, "feedback_date": ""}
+{"version": 1, "submitted_date": "2024-08-14T08:00:42.190468", "received_date": "2024-08-14T08:00:42.202949", "event_session_id": "6f888ecf-bc25-48f0-bfd2-0280ced98644", "db_question_evaluation_id": 1, "code_to_eval": "datetime_now", "evaluation_engine": "chatGPT", "prompt_version": 1, "evaluation_response": "[{\"criteria\": \"HUMAN_FEEDBACK\", \"explanation\": \"Some code that is evaluated.\", \"EVAL\": 0}, {\"criteria\": \"DRY\", \"explanation\": \"The memory allocation and initialization for ``p1``, ``p2``, and ``p3`` are repetitive. Consider creating a function like ``allocateAndInitializeMemory``.\", \"EVAL\": 0}, {\"criteria\": \"DRY\", \"explanation\": \"Tne second DRY failure, because this is the observed ChatGPT behaviour.\", \"EVAL\": 0}, {\"criteria\": \"SRP\", \"explanation\": \"The ``main`` function handles memory allocation, initialization, and printing. You should separate these responsibilities into different functions like ``allocateMemory``, ``initializeData``, and ``printData``.\", \"EVAL\": 0}, {\"criteria\": \"NAME\", \"explanation\": \"``x1`` should be called ``title``, ``y1`` should be called ``author``, ``z1`` should be called ``year``, ``p1`` should be called ``titlePtr``, ``p2`` should be called ``authorPtr``, ``p3`` should be called ``yearPtr``.\", \"EVAL\": 0}, {\"criteria\": \"NO_COMPILE\", \"explanation\": \"Not infringed\", \"EVAL\": 0}, {\"criteria\": \"MC\", \"explanation\": \"Not infringed\", \"EVAL\": 0}]", "has_feedback": true, "feedback_date": "2024-08-14T08:00:51.526638"}
+{"version": 1, "submitted_date": "2024-08-14T08:00:58.399871", "received_date": "2024-08-14T08:00:58.410981", "event_session_id": "6f888ecf-bc25-48f0-bfd2-0280ced98644", "db_question_evaluation_id": 2, "code_to_eval": "// C Program to Make a Simple Calculator using if-else Statements \r\n#include <limits.h>\r\n#include <stdio.h>\r\n\r\n// Function that implements the simple calculator\r\ndouble simpleCalc(double num1, double num2, char op) {\r\n    int result;\r\n\r\n    // Perform the corresponding operation\r\n    if (op == '+') {\r\n\r\n        // Addition\r\n        result = num1 + num2;\r\n    }\r\n    else if (op == '-') {\r\n\r\n        // Subtraction\r\n        result = num1 - num2;\r\n    }\r\n    else if (op == '*') {\r\n\r\n        // Multiplication\r\n        result = num1 * num2;\r\n    }\r\n    else if (op == '/') {\r\n\r\n        // Division\r\n        // Check for division by zero\r\n        if (num2 != 0) {\r\n            result = num1 / num2;\r\n        }\r\n        else {\r\n            printf(\"Error! Division by zero.\\n\");\r\n            return INT_MIN;\r\n        }\r\n    }\r\n    else {\r\n        printf(\"Error! Operator is not correct.\\n\");\r\n        return INT_MIN;\r\n    }\r\n\r\n    return result;\r\n}\r\n\r\nint main() {\r\n    char op;\r\n    double num1, num2;\r\n\r\n    // Read the operator\r\n    printf(\"Enter an operator (+, -, *, /): \");\r\n    scanf(\"%c\", &op);\r\n\r\n    // Read the two numbers\r\n    printf(\"Enter two operands: \");\r\n    scanf(\"%lf %lf\", &num1, &num2);\r\n\r\n    double result = simpleCalc(num1, num2, op);\r\n\r\n    printf(\"Result: %.2lf\\n\", result);\r\n\r\n    return 0;\r\n}\r\n", "evaluation_engine": "chatGPT", "prompt_version": 1, "evaluation_response": "[{\"criteria\": \"HUMAN_FEEDBACK\", \"explanation\": \"\", \"EVAL\": 0}, {\"criteria\": \"DRY\", \"explanation\": \"The memory allocation and initialization for ``p1``, ``p2``, and ``p3`` are repetitive. Consider creating a function like ``allocateAndInitializeMemory``.\", \"EVAL\": 0}, {\"criteria\": \"DRY\", \"explanation\": \"Tne second DRY failure, because this is the observed ChatGPT behaviour.\", \"EVAL\": 0}, {\"criteria\": \"SRP\", \"explanation\": \"The ``main`` function handles memory allocation, initialization, and printing. You should separate these responsibilities into different functions like ``allocateMemory``, ``initializeData``, and ``printData``.\", \"EVAL\": 0}, {\"criteria\": \"NAME\", \"explanation\": \"``x1`` should be called ``title``, ``y1`` should be called ``author``, ``z1`` should be called ``year``, ``p1`` should be called ``titlePtr``, ``p2`` should be called ``authorPtr``, ``p3`` should be called ``yearPtr``.\", \"EVAL\": 0}, {\"criteria\": \"NO_COMPILE\", \"explanation\": \"Not infringed\", \"EVAL\": 0}, {\"criteria\": \"MC\", \"explanation\": \"Not infringed\", \"EVAL\": 0}]", "has_feedback": false, "feedback_date": ""}
+{"version": 1, "submitted_date": "2024-08-14T08:00:58.399871", "received_date": "2024-08-14T08:00:58.410981", "event_session_id": "6f888ecf-bc25-48f0-bfd2-0280ced98644", "db_question_evaluation_id": 2, "code_to_eval": "// C Program to Make a Simple Calculator using if-else Statements \r\n#include <limits.h>\r\n#include <stdio.h>\r\n\r\n// Function that implements the simple calculator\r\ndouble simpleCalc(double num1, double num2, char op) {\r\n    int result;\r\n\r\n    // Perform the corresponding operation\r\n    if (op == '+') {\r\n\r\n        // Addition\r\n        result = num1 + num2;\r\n    }\r\n    else if (op == '-') {\r\n\r\n        // Subtraction\r\n        result = num1 - num2;\r\n    }\r\n    else if (op == '*') {\r\n\r\n        // Multiplication\r\n        result = num1 * num2;\r\n    }\r\n    else if (op == '/') {\r\n\r\n        // Division\r\n        // Check for division by zero\r\n        if (num2 != 0) {\r\n            result = num1 / num2;\r\n        }\r\n        else {\r\n            printf(\"Error! Division by zero.\\n\");\r\n            return INT_MIN;\r\n        }\r\n    }\r\n    else {\r\n        printf(\"Error! Operator is not correct.\\n\");\r\n        return INT_MIN;\r\n    }\r\n\r\n    return result;\r\n}\r\n\r\nint main() {\r\n    char op;\r\n    double num1, num2;\r\n\r\n    // Read the operator\r\n    printf(\"Enter an operator (+, -, *, /): \");\r\n    scanf(\"%c\", &op);\r\n\r\n    // Read the two numbers\r\n    printf(\"Enter two operands: \");\r\n    scanf(\"%lf %lf\", &num1, &num2);\r\n\r\n    double result = simpleCalc(num1, num2, op);\r\n\r\n    printf(\"Result: %.2lf\\n\", result);\r\n\r\n    return 0;\r\n}\r\n", "evaluation_engine": "chatGPT", "prompt_version": 1, "evaluation_response": "[{\"criteria\": \"HUMAN_FEEDBACK\", \"explanation\": \"Can't click buttons :(\", \"EVAL\": 0}, {\"criteria\": \"DRY\", \"explanation\": \"The memory allocation and initialization for ``p1``, ``p2``, and ``p3`` are repetitive. Consider creating a function like ``allocateAndInitializeMemory``.\", \"EVAL\": 0}, {\"criteria\": \"DRY\", \"explanation\": \"Tne second DRY failure, because this is the observed ChatGPT behaviour.\", \"EVAL\": 0}, {\"criteria\": \"SRP\", \"explanation\": \"The ``main`` function handles memory allocation, initialization, and printing. You should separate these responsibilities into different functions like ``allocateMemory``, ``initializeData``, and ``printData``.\", \"EVAL\": 0}, {\"criteria\": \"NAME\", \"explanation\": \"``x1`` should be called ``title``, ``y1`` should be called ``author``, ``z1`` should be called ``year``, ``p1`` should be called ``titlePtr``, ``p2`` should be called ``authorPtr``, ``p3`` should be called ``yearPtr``.\", \"EVAL\": 0}, {\"criteria\": \"NO_COMPILE\", \"explanation\": \"Not infringed\", \"EVAL\": 0}, {\"criteria\": \"MC\", \"explanation\": \"Not infringed\", \"EVAL\": 0}]", "has_feedback": true, "feedback_date": "2024-08-14T08:01:07.548379"}
+{"version": 1, "submitted_date": "2024-08-14T08:01:30.889870", "received_date": "2024-08-14T08:01:30.901795", "event_session_id": "6f888ecf-bc25-48f0-bfd2-0280ced98644", "db_question_evaluation_id": 3, "code_to_eval": "", "evaluation_engine": "chatGPT", "prompt_version": 1, "evaluation_response": "[{\"criteria\": \"HUMAN_FEEDBACK\", \"explanation\": \"\", \"EVAL\": 0}, {\"criteria\": \"DRY\", \"explanation\": \"The memory allocation and initialization for ``p1``, ``p2``, and ``p3`` are repetitive. Consider creating a function like ``allocateAndInitializeMemory``.\", \"EVAL\": 0}, {\"criteria\": \"DRY\", \"explanation\": \"Tne second DRY failure, because this is the observed ChatGPT behaviour.\", \"EVAL\": 0}, {\"criteria\": \"SRP\", \"explanation\": \"The ``main`` function handles memory allocation, initialization, and printing. You should separate these responsibilities into different functions like ``allocateMemory``, ``initializeData``, and ``printData``.\", \"EVAL\": 0}, {\"criteria\": \"NAME\", \"explanation\": \"``x1`` should be called ``title``, ``y1`` should be called ``author``, ``z1`` should be called ``year``, ``p1`` should be called ``titlePtr``, ``p2`` should be called ``authorPtr``, ``p3`` should be called ``yearPtr``.\", \"EVAL\": 0}, {\"criteria\": \"NO_COMPILE\", \"explanation\": \"Not infringed\", \"EVAL\": 0}, {\"criteria\": \"MC\", \"explanation\": \"Not infringed\", \"EVAL\": 0}]", "has_feedback": false, "feedback_date": ""}

test/test_storage.py

@@ -16,8 +16,7 @@ def test_loading_submitted():
     assert len(eval_obj) > 0
 
 def test_loading_submitted2():
-    sub_file = Path(
-        "../data/persistent/submitted-2024-08-14 07:42:05.411354-9030c34a-a31a-47ad-a399-1b0b0dbd6e33.jsonl")
+    sub_file = Path("raw_data_submitted-2024-08-14T07_47_28.731439-5977364a-5411-4f15-9c73-43f90d49c762.jsonl")
     submits = []
     with open(sub_file, "r") as f:
         for line in f: