Merge branch 'main' into dev

frontend/app/components/Client/CustomFields/CustomFields.js

@@ -23,7 +23,7 @@ import { confirm } from 'UI/Confirmation';
 })
 @withPageTitle('Metadata - OpenReplay Preferences')
 class CustomFields extends React.Component {
-  state = { showModal: false, currentSite: this.props.sites.get(0) };
+  state = { showModal: false, currentSite: this.props.sites.get(0), deletingItem: null };
 
   componentWillMount() {
     const activeSite = this.props.sites.get(0);
@@ -60,15 +60,15 @@ class CustomFields extends React.Component {
       confirmation: `Are you sure you want to remove?`
     })) {
       const { currentSite } = this.state;
-      this.props.remove(currentSite.id, field.index).then(() => {
-        
-      });
+      this.setState({ deletingItem: field.index });
+      this.props.remove(currentSite.id, field.index)
+        .then(() => this.setState({ deletingItem: null }));
     }
   }
 
   render() {
     const { fields, field, loading } = this.props;
-    const { showModal, currentSite } = this.state;
+    const { showModal, currentSite, deletingItem } = this.state;
     return (
       <div>
         <SlideModal
@@ -105,6 +105,7 @@ class CustomFields extends React.Component {
             <div className={ styles.list }>
               { fields.filter(i => i.index).map(field => (
                 <ListItem
+                  disabled={deletingItem && deletingItem === field.index}
                   key={ field._key }
                   field={ field }
                   onEdit={ this.init }

frontend/app/components/Client/CustomFields/ListItem.js

@@ -3,9 +3,9 @@ import cn from 'classnames'
 import { Icon } from 'UI';
 import styles from './listItem.css';
 
-const ListItem = ({ field, onEdit, onDelete }) => {
+const ListItem = ({ field, onEdit, onDelete, disabled }) => {
   return (
-    <div className={ cn(styles.wrapper, field.index === 0 ? styles.preDefined : '' ) } onClick={ () => field.index != 0 && onEdit(field) } >
+    <div className={ cn(styles.wrapper, field.index === 0 ? styles.preDefined : '', { [styles.disabled] : disabled} ) } onClick={ () => field.index != 0 && onEdit(field) } >
       <span>{ field.key }</span>      
       <div className={ styles.actions } data-hidden={ field.index === 0}>
         <div className={ styles.button } onClick={ (e) => { e.stopPropagation(); onDelete(field) } }>

frontend/app/components/Client/CustomFields/listItem.css

@@ -47,4 +47,9 @@
   border-radius: 10px;
   background-color: $gray-lightest;
   box-shadow: 0 0 0 1px $gray-light inset;
+}
+
+.disabled {
+  opacity: 0.5;
+  pointer-events: none;
 }

frontend/app/components/Session_/EventsBlock/Metadata/Metadata.js

@@ -4,18 +4,19 @@ import { NoContent, IconButton, Popup } from 'UI';
 import withToggle from 'HOCs/withToggle';
 import MetadataItem from './MetadataItem';
 import stl from './metadata.css';
+import cn from 'classnames';
 
 export default connect(state => ({
   metadata: state.getIn([ 'sessions', 'current', 'metadata' ]),
 }))(function Metadata ({ metadata }) {
   const [ visible, setVisible ] = useState(false);
-  const toggle = useCallback(() => metadata.size > 0 && setVisible(v => !v), []);
+  const toggle = useCallback(() => metadata.length > 0 && setVisible(v => !v), []);
   return (
     <>
       <Popup
         trigger={
           <IconButton
-            className="w-full"
+            className={cn("w-full", { 'opacity-25' : metadata.length === 0 })}
             onClick={ toggle }
             icon="id-card"
             plain
@@ -23,6 +24,7 @@ export default connect(state => ({
             primaryText
             active={ visible }
             id="metadata-button"
+            // disabled={ metadata.length === 0 }
           />
         }
         content={

frontend/app/components/shared/TrackerUpdateMessage/TrackerUpdateMessage.js

@@ -12,7 +12,7 @@ const TrackerUpdateMessage= (props) => {
   const hasSessions = !!activeSite && !activeSite.recorded;
   const appVersionInt = parseInt(window.ENV.TRACKER_VERSION.split(".").join(""))
   const trackerVersionInt = site.trackerVersion ? parseInt(site.trackerVersion.split(".").join("")) : 0
-  const needUpdate = !hasSessions && trackerVersionInt > appVersionInt;
+  const needUpdate = !hasSessions && appVersionInt > trackerVersionInt;
   return needUpdate ? (
     <>
       {(

frontend/app/player/MessageDistributor/managers/AssistManager.ts

@@ -458,7 +458,7 @@ export default class AssistManager {
         name: store.getState().getIn([ 'user', 'account', 'name']),
       });
 
-      // this.md.overlay.addEventListener("mousemove", this.onMouseMove)
+      this.md.overlay.addEventListener("mousemove", this.onMouseMove)
       // this.md.overlay.addEventListener("click", this.onMouseClick)
     });
     //call.peerConnection.addEventListener("track", e => console.log('newtrack',e.track))

frontend/env.js

@@ -21,7 +21,7 @@ const oss = {
 	MINIO_ACCESS_KEY: process.env.MINIO_ACCESS_KEY,
 	MINIO_SECRET_KEY: process.env.MINIO_SECRET_KEY,
 	ICE_SERVERS: process.env.ICE_SERVERS,
-	TRACKER_VERSION: '3.4.12', // trackerInfo.version,
+	TRACKER_VERSION: '3.4.16', // trackerInfo.version,
 }
 
 module.exports = {