I am struggling with Odoo implementing a module for a small business:

Sale Order - Standard Model and Views, added fields not relevant to this issue

Sale Order Line - Standard Views, add field for batch ID on appropriate items

Panel Job - Contains definition of cut-to-length manufacturing job including list of pieces and lengths

I need to add a button to the Sale Order form view to open the form view for Panel Job without saving Sale Order. Panel Job's Form view has a button that then creates a Sale Order Line referencing the Panel Job. At this point I would not like to permanently commit Panel Job either. When the Sale Order is saved manually or otherwise acted upon (e.g. emailed), it can save normally, both Panel Job and Sale Order.

I have attempted object and action buttons defining the ir.action.act_window, and this works minus the saving when I don't want it to.

Research has pointed me toward client actions and javascript buttons, but I have been unsuccessful in having these actually work, in that I can't even get the templates to show on the sales order. This is what I currently have:

views/sales_order_updated_views.xml

<odoo>
    <record id="module_sale_order" model="ir.ui.view">
        <field name="name">Sales Order</field>
        <field name="model">sale.order</field>
        <field name="inherit_id" ref="sale.view_order_form"/>
        <field name="arch" type="xml">


            <xpath expr="//field[@name='order_line']" position="before">
                <div id="addNewPanelJobButton"/>
            </xpath>
  
...
  
</record>
</odoo>

views/client_actions.xml

<odoo>    
  <record id="act_new_panel_job" model="ir.actions.client">
        <field name="name">Add New Panel Job</field>
        <field name="tag">module.NewPanelJob</field>
        <field name="target">new</field>
    </record>
</odoo>

static/src/xml/newpaneljobtemplate.xml

<?xml version="1.0" encoding="UTF-8"?>
<odoo>
    <template xml:space="preserve">
        <xpath expr="//@div[id=addNewPanelJobButton]" position="replace">
            <t t-name="module.NewPanelJobTemplate" t-inherit="web.FormView">
                <p t-on-click="module.NewPanelJob">Template Works</p>
            </t>
        </xpath>
    </template>
</odoo>

static/src/js/client_actions.js

import { registry } from "@web/core/registry";
import { Component } from "@odoo/owl";
import { useService } from "@web/core/utils/hooks";


export class NewPanelJobComponent extends Component {
    setup() {
        super.setup();
        this.action = useService("action");
    };


    addNewPanelJob() {
        this.action.doAction({
        type: 'ir.actions.act_window',
        res_model: 'module.panel_job',
        views: [[false, 'form']],
        target: 'new',
        });
    }
}


NewPanelJobComponent.template = "module.NewPanelJobTemplate";


registry.category("actions").add("module.NewPanelJob",NewPanelJobComponent);

Am I even going down the right path with this?

I'm not sure what standard practices are and finding examples in the code has been less than helpful.

Thanks in advance for any insight.