Trouble adding the Middle Name field to the common/form-contact-person/form-contact-person

I want to add Middle Name (MidName) field to the common html for the common Contacts thingy.

This is my code.  It publishes without any errors, but the field does not show up.

This is the first time trying to modify a “common” view.  I’m sure something is wrong but I don’t know what.

I was not able to find anything on the web for this specific need.

//THIS IS THE TS
import {
	PXFieldState,
} from "client-controls";
import { Contact } from "src/screens/common/form-contact-person/form-contact-person";

export interface ExtendedContact extends Contact { }

export class ExtendedContact {
	MidName: PXFieldState;
}


//this is the HTML
<template>
	<qp-include url="src/screens/common/form-contact-person/form-contact-person">
		<field append="#{{fs-id}}" name="MidName" config-allow-edit.bind="true"></field>
	</qp-include>
</template>

If anyone has done this already, please let me know what I need to do to fix my code.

Thank you all in advance.

Quick edit...I can add the field on the contacts screen using the screen editor on CR30200 contacts screen, show this is not a show stopper.  I just wanted to be able to deliver a project that doesn’t require the customer do manually add the field.