feat(shared): Added support for flags

sites/shared/components/workbench/views/pattern-with-menu.mjs

@@ -1,10 +1,10 @@
 import { PanZoomContextProvider } from 'shared/components/workbench/pattern/pan-zoom-context.mjs'
-import { ViewHeader, ns as headerNs } from './view-header.mjs'
 import { MenuWrapper } from 'shared/components/workbench/menus/shared/menu-wrapper.mjs'
+import { Flags } from './flags.mjs'
 
-export const ns = headerNs
+export const ns = ['common', 'core-settings', 'ui-settings']
 
-/** a layout for views that include a drafted pattern, a sidebar menu, and the draft view header */
+/** a layout for views that include a drafted pattern, a sidebar menu, and a header you pass it */
 export const PatternWithMenu = ({
   settings,
   ui,
@@ -16,12 +16,13 @@ export const PatternWithMenu = ({
   pattern,
   menu,
   setSettings,
-  noHeader = false,
+  Header = false,
+  flags = false,
 }) => (
   <PanZoomContextProvider>
     <div className="flex flex-col h-full">
-      {noHeader ? null : (
-        <ViewHeader
+      {Header ? (
+        <Header
           {...{
             settings,
             ui,
@@ -32,7 +33,8 @@ export const PatternWithMenu = ({
             setSettings,
           }}
         />
-      )}
+      ) : null}
+      {flags ? <Flags {...{ update, control, flags }} /> : null}
       <div className="flex lg:flex-row grow lg:max-h-[90vh] max-h-[calc(100vh-3rem)] h-full py-4 lg:mt-6">
         <div className="lg:w-2/3 flex flex-col h-full grow px-4">
           {title}