prosumer: show matching global models as starting point for FL process

Author: sgsfak

islands/prosumer/ProsumerStep3.tsx

@@ -1,12 +1,13 @@
 import { BasicSelect, SelectOption, SelectProps } from "@/components/Select.tsx";
 import { batch, Signal, useComputed, useSignal, useSignalEffect } from "@preact/signals";
 import classNames from "@/utils/classnames.js";
-import { ProsumerWorkflowFLData } from "@/utils/types.ts";
+import { ModelSearchResponseItem, ProsumerWorkflowFLData } from "@/utils/types.ts";
 
 export default function ProsumerStep3(props: {
     process_name: string;
     disabled: boolean;
     fl_process?: ProsumerWorkflowFLData;
+    global_models: ModelSearchResponseItem[];
 }) {
     console.log("STEP2 disabled", props.disabled);
     // const initial_filters = props.criteria
@@ -64,13 +65,16 @@ export default function ProsumerStep3(props: {
     //     })
     // );
 
+    const selected_global_model_id = useSignal<number>(0);
     const aggregationRule = useSignal<string>(props.fl_process?.computation ?? "Simple Averaging");
     const num_of_fl_rounds = useSignal<number>(props.fl_process?.number_of_rounds ?? 1);
     const num_of_iterations = useSignal<number>(props.fl_process?.num_of_iterations ?? 1);
     const error_num_of_iterations = useSignal<boolean>(false);
     const solver = useSignal<string>(props.fl_process?.solver ?? "HQS"); //  ["HQS", "ADMM"]
     const denoiser = useSignal<string>(props.fl_process?.denoiser ?? "CNN"); // ["CNN", "Autoencoder", "Transformer"]
 
+    console.log(props);
+
     const onChangeAggregationRule = (e: Event) => {
         const target = e.target as HTMLInputElement;
         console.log("GOT", target, target.value);
@@ -197,6 +201,33 @@ export default function ProsumerStep3(props: {
                         <label>Number of FL Rounds</label>
                         <i>numbers</i>
                     </div>
+                    {props.global_models.length > 0 && (
+                        <>
+                            <h5>Global Models to initialize the FL process</h5>
+                            <div class="grid large-space">
+                                {props.global_models.map((r, index) => (
+                                    <div class="secondary-container padding s12 m6 l3" id={`model-${index}`}>
+                                        <label class="radio extra">
+                                            <input
+                                                type="radio"
+                                                name="model"
+                                                value={r.id}
+                                                disabled={props.disabled}
+                                                checked={r.id == selected_global_model_id.peek()}
+                                            />
+                                            <span>Model {r.name ?? ""} (ID: {r.id} - Size: {r.size ?? ""})</span>
+                                        </label>
+                                        {r.name && <div>Name: {r.name}</div>}
+                                        {r.application_type && <div>Application type: {r.application_type}</div>}
+                                        {r.round && <div>Rounds: {r.round}</div>}
+                                        {r.input && <div>Input: {r.input}</div>}
+                                        {r.output && <div>Output: {r.output}</div>}
+                                        {r.nn_architecture && <div>Architecture: {r.nn_architecture}</div>}
+                                    </div>
+                                ))}
+                            </div>
+                        </>
+                    )}
                 </p>
 
                 {!props.disabled && (

routes/consumer/[consumer_id]/step2.tsx

@@ -61,7 +61,7 @@ export default function Step2Page(props: PageProps<Data>) {
     const disabled = !!selected_model_id;
     const pp = (r: ModelSearchResponseItem) => {
         return (
-            <div class="padding ">
+            <div class="padding secondary-container s12 m6 l3">
                 <label class="radio extra">
                     <input
                         type="radio"
@@ -70,7 +70,7 @@ export default function Step2Page(props: PageProps<Data>) {
                         disabled={disabled}
                         checked={r.id == selected_model_id}
                     />
-                    <span>Model {r.name ?? ""} ({r.id} - {r.size ?? ""})</span>
+                    <span>Model {r.name ?? ""} (ID: {r.id} - Size: {r.size ?? ""})</span>
                 </label>
                 {r.name && <div>Name: {r.name}</div>}
                 {r.application_type && <div>Application type: {r.application_type}</div>}
@@ -90,7 +90,7 @@ export default function Step2Page(props: PageProps<Data>) {
                     <legend>
                         {disabled ? "You have selected the following model" : "Select one of the models below"}
                     </legend>
-                    <nav class="vertical">
+                    <nav class="grid large-space">
                         {results.map(pp)}
                     </nav>
                 </fieldset>

routes/prosumer/[prosumer_id]/step1.tsx

@@ -1,6 +1,14 @@
 import { Handlers, PageProps } from "$fresh/server.ts";
-import { Domain, ProsumerWorkflowData, SSISearchCriterion, SSISearchCriterionOperator, User } from "@/utils/types.ts";
-import { dl_domains, do_kg_get_prosumer_data, do_ssi_search } from "@/utils/backend.ts";
+import {
+    Domain,
+    ModelSearchAttributeCriterion,
+    ModelSearchCriterion,
+    ProsumerWorkflowData,
+    SSISearchCriterion,
+    SSISearchCriterionOperator,
+    User,
+} from "@/utils/types.ts";
+import { dl_domains, do_dl_model_search, do_kg_get_prosumer_data, do_ssi_search } from "@/utils/backend.ts";
 import { get_user, redirect_to_login, SessionState } from "@/utils/http.ts";
 import ProsumerStep1 from "@/islands/prosumer/ProsumerStep1.tsx";
 import { db_get, db_store, set_user_session_data, user_session_data } from "@/utils/db.ts";
@@ -74,13 +82,35 @@ export const handler: Handlers<unknown, SessionState> = {
 
         console.log("CRITERIA", filters);
 
+        // Make a similar query to the DL to locate global models
+        // that can be used as starting points for the FL process
+
+        const model_search_map: Map<Domain, ModelSearchAttributeCriterion[]> = new Map();
+        filters.forEach((filter) => {
+            if (model_search_map.has(filter.domain)) {
+                model_search_map.get(filter.domain)?.push({ attribute: filter.attribute, value: filter.value });
+            } else {
+                model_search_map.set(filter.domain, [{ attribute: filter.attribute, value: filter.value }]);
+            }
+        });
+        const model_search_criteria: ModelSearchCriterion[] = model_search_map.entries().map(([domain, criteria]) => ({
+            domain,
+            attributes: criteria,
+        })).toArray();
+
+        const global_models = (await do_dl_model_search(
+            user,
+            model_search_criteria,
+        )) ?? [];
+
         const w: ProsumerWorkflowData = {
             id: prosumer_id,
             name: process_name,
             ssi: {
                 status: "NOT STARTED",
                 process_id: "",
                 criteria: filters,
+                global_models: global_models,
             },
             models_selected: [],
             kg_results: [],

routes/prosumer/[prosumer_id]/step3.tsx

@@ -1,8 +1,8 @@
 import { Handlers, PageProps } from "$fresh/server.ts";
-import { Domain, ProsumerWorkflowData, ProsumerWorkflowFLData, SSISearchCriterion, User } from "@/utils/types.ts";
-import { dl_domains, do_fl_poll, do_fl_submit, do_ssi_poll } from "@/utils/backend.ts";
+import { ModelSearchResponseItem, ProsumerWorkflowData, ProsumerWorkflowFLData, User } from "@/utils/types.ts";
+import { do_fl_poll, do_fl_submit, do_ssi_poll } from "@/utils/backend.ts";
 import { get_user, redirect_to_login, SessionState } from "@/utils/http.ts";
-import { db_get, db_store, set_user_session_data, user_session_data } from "@/utils/db.ts";
+import { db_get, db_store, user_session_data } from "@/utils/db.ts";
 
 import { redirect } from "@/utils/http.ts";
 import { prosumer_key } from "@/utils/misc.ts";
@@ -12,6 +12,7 @@ interface Data {
     process_name: string;
     disabled: boolean;
     fl_process?: ProsumerWorkflowFLData;
+    global_models: ModelSearchResponseItem[];
 }
 
 async function user_profile(sessionId: string): Promise<User> {
@@ -117,17 +118,19 @@ export const handler: Handlers<unknown, SessionState> = {
             process_name: prosumer_data?.name || "",
             fl_process: fl_process_data,
             disabled: disabled,
+            global_models: prosumer_data.ssi.global_models,
         });
     },
 };
 
 export default function Step3Page(props: PageProps<Data>) {
-    console.log("disabled", props.data.disabled);
+    console.log("disabled-3", props.data.disabled);
     return (
         <ProsumerStep3
             process_name={props.data.process_name}
             disabled={props.data.disabled}
             fl_process={props.data.fl_process}
+            global_models={props.data.global_models}
         />
     );
 }

routes/prosumer/[prosumer_id]/step4.tsx

@@ -2,13 +2,11 @@ import { Handlers, PageProps } from "$fresh/server.ts";
 import { FLProcessStatusData, ProsumerWorkflowData, ProsumerWorkflowFLData, User } from "@/utils/types.ts";
 import { do_fl_poll, update_global_model_round } from "@/utils/backend.ts";
 import { get_user, redirect_to_login, SessionState } from "@/utils/http.ts";
-import { db_get, db_store, set_user_session_data, user_session_data } from "@/utils/db.ts";
+import { db_get, db_store, user_session_data } from "@/utils/db.ts";
 
 import { redirect } from "@/utils/http.ts";
 import { prosumer_key } from "@/utils/misc.ts";
-import ProsumerStep3 from "@/islands/prosumer/ProsumerStep3.tsx";
 import AutoReload from "@/islands/AutoReload.tsx";
-import { DATA_CURRENT } from "$fresh/src/constants.ts";
 
 interface Data {
     process_name: string;
@@ -28,7 +26,7 @@ async function user_profile(sessionId: string): Promise<User> {
 // STEP3: allow the user to select the FL parameters and start the FL process
 
 export const handler: Handlers<unknown, SessionState> = {
-    async POST(req, ctx) {
+    async POST(_req, _ctx) {
         // const user = await get_user(req, ctx.state.session);
         // if (!user) {
         //     return redirect_to_login(req);
@@ -113,7 +111,7 @@ export const handler: Handlers<unknown, SessionState> = {
             const flprocessstatus: FLProcessStatusData = await do_fl_poll(user, fl_process_data.process_id);
             const previous_status = prosumer_data.fl_process.status;
             if (previous_status.current_round < flprocessstatus.current_round) {
-                const [global_model_id, dl_error] = await update_global_model_round(
+                const [global_model_id, _dl_error] = await update_global_model_round(
                     user,
                     fl_process_data.process_id,
                     flprocessstatus.current_round,

utils/types.ts

@@ -69,6 +69,7 @@ export interface ProsumerWorkflowSSIData {
     process_id: string;
     status: SSISearchStatus;
     criteria: SSISearchCriterion[];
+    global_models: ModelSearchResponseItem[]; // Global models matching SSI criteria if found
     results?: string[]; // Results, "model ids"
 }