add look at select face button to tool bar

web/app/cad/actions/usabilityActions.js

@@ -1,5 +1,6 @@
 import {AXIS, ORIGIN} from '../../math/l3space';
 import Vector from 'math/vector';
+import {RiCamera2Line} from "react-icons/ri";
 
 const NEG_X = AXIS.X.negate();
 const NEG_Y = AXIS.Y.negate();
@@ -63,6 +64,12 @@ export default [
   },  
   {
     id: 'LookAtFace',
+    appearance: {
+      icon: RiCamera2Line,
+      info: 'move camera to show selected face',
+      label: 'Look at'
+    },
+
     invoke: ctx => {
       let face = ctx.services.selection.face.single;
       if (face) {

web/app/cad/dom/components/PlugableToolbar.jsx

@@ -7,6 +7,7 @@ import {ActionButtonBehavior} from '../../actions/ActionButtonBehavior';
 import capitalize from 'gems/capitalize';
 import {combine} from 'lstream';
 import {useStream} from "../../../../../modules/ui/effects";
+import {NoIcon} from "../../../sketcher/icons/NoIcon";
 
 function ConfigurableToolbar({actions, size, ...props}) {
   return <Toolbar size={size} {...props}>
@@ -53,10 +54,8 @@ function ActionButton({label, icon, icon96, icon32, cssIcons, symbol, size, noLa
     }
   }
   if (!icon) {
-    icon = <span>{symbol||(label&&label.charAt(0))}</span>;
-    if (!icon) {
-      icon = '?';
-    }
+    const txtStub = symbol||(label&&label.charAt(0));
+    icon = txtStub ?  <span>{txtStub}</span> : <NoIcon />;
   }
     
   return <ToolbarButton disabled={!enabled} {...props}>

web/app/cad/sketch/sketcherUIContrib.js

@@ -52,6 +52,8 @@ export const SKETCHER_MODE_HEADS_UP_ACTIONS = [
   '-',
   constraintGlobalActions.map(a => toSketcherActionId(a.id)),
   '-',
+  ['LookAtFace'],
+  '-',
   ['sketchOpenInTab']
 ];