TFD
ThoughtSpot For Developers•3mo ago
locutus_dev

locutus_dev - We do not want any of our users t...

We do not want any of our users to create custom actions. We have made it so the feature doesn't work but we can't seem to find a way to remove the lightning bolt through the SDK. We are in the progress of upgrading from 9.5 to 10.1. It would be ideal if we could solve this for both versions. Can we remove this lightning bolt?
No description
9 Replies
shikharTS
shikharTS•3mo ago
Unfortunately we do not have a direct action to hide this for now. I would recommend to use unstable CSS rules to hide this. ALso would be good to raise a feature request requesting this. Seems like a valid ask to me.
locutus_dev
locutus_devOP•3mo ago
This doesn't appear to work. That button doesn't have an ID or a unique class applied to it. So, I'm using the selector:
.answer-edit-panel-module__answerConfigPanel.flex-layout-module__horizontal > div > div:nth-child(4)
So, I added this to the init:
{"customizations":{"style":{"customCSS":{"rules_UNSTABLE":{".answer-edit-panel-module__answerConfigPanel.flex-layout-module__horizontal > div > div:nth-child(4)":{"display":"none"}}}}}}
But, it didn't hide the button.
jbc
jbc•3mo ago
You can use this selector instead which should target this element better 
.answer-edit-panel-nav-module__answerConfigPanelNav .answer-edit-panel-nav-module__panelButton [data-testid="action-selector-nav-btn"]
.answer-edit-panel-nav-module__answerConfigPanelNav .answer-edit-panel-nav-module__panelButton [data-testid="action-selector-nav-btn"]
locutus_dev
locutus_devOP•3mo ago
I still can't seem to get these custom css to work... in v9.5, it just does nothing. in v10.1 it seems to prevent the embedding to take effect (I just get the three dots and an error in the console: Uncaught (in promise) DataCloneError: Failed to execute 'postMessage' on 'MessagePort': #<Object> could not be cloned. The stacktrace on that is pretty short: 
$je    @    index.tsx:142
await in $je        
(anonymous)    @    index.tsx:142
$je    @    index.tsx:142
await in $je        
(anonymous)    @    index.tsx:142
If it helps, this is my init call where I pass in this rule (for both versions): 
init({
    thoughtSpotHost: `https://${ this.localBaseUrl }`,
    authType: AuthType.TrustedAuthToken,
    getAuthToken: () => refreshInsightsAuthToken(),
    username: this.xactInsightsUsername,
    customizations: {
        style: {
            customCSS: {
                "rules_UNSTABLE": {
                    "[data-testid='action-selector-nav-btn']": {
                        "display":"none"
                    }
                }
            },
        },
    },
});
init({
    thoughtSpotHost: `https://${ this.localBaseUrl }`,
    authType: AuthType.TrustedAuthToken,
    getAuthToken: () => refreshInsightsAuthToken(),
    username: this.xactInsightsUsername,
    customizations: {
        style: {
            customCSS: {
                "rules_UNSTABLE": {
                    "[data-testid='action-selector-nav-btn']": {
                        "display":"none"
                    }
                }
            },
        },
    },
});
Am I missing something?
jbc
jbc•3mo ago
Each TS version may have a chance of these elements changing and the related css being affected. So, you would need to check what css works best for each of the release versions. Can you try again with this: 
init({
    thoughtSpotHost: `https://${ this.localBaseUrl }`,
    authType: AuthType.TrustedAuthToken,
    getAuthToken: () => refreshInsightsAuthToken(),
    username: this.xactInsightsUsername,
    customizations: {
        style: {
            customCSS: {
                "rules_UNSTABLE": {
                    ".answer-edit-panel-nav-module__answerConfigPanelNav .answer-edit-panel-nav-module__panelButton [data-testid='action-selector-nav-btn']": {
                        "display":"none"
                    }
                }
            },
        },
    },
});
init({
    thoughtSpotHost: `https://${ this.localBaseUrl }`,
    authType: AuthType.TrustedAuthToken,
    getAuthToken: () => refreshInsightsAuthToken(),
    username: this.xactInsightsUsername,
    customizations: {
        style: {
            customCSS: {
                "rules_UNSTABLE": {
                    ".answer-edit-panel-nav-module__answerConfigPanelNav .answer-edit-panel-nav-module__panelButton [data-testid='action-selector-nav-btn']": {
                        "display":"none"
                    }
                }
            },
        },
    },
});
locutus_dev
locutus_devOP•3mo ago
I have tried that selector too. It didn't work so I removed the classes hoping it would be able to work. I figured it would be less restrictive. I also tried "display":"none!important". I even tried {".button-module__button":{"background-color": "#9F2020"}} and {".button-module__button":{"background-color": "#9F2020!important"}} just so I could see if any of the buttons (there are 32 on that page with that class) get the new color. None of them did. I really feel like I'm missing something...
Mark K
Mark K•3mo ago
This worked for me: 
 'div:has(> .button-module__button[aria-label="Custom actions"])': {
            "display": "none !important"
          }, 
 'div:has(> .button-module__button[aria-label="Custom actions"])': {
            "display": "none !important"
          },
locutus_dev
locutus_devOP•3mo ago
I am still not making any progress with these custom CSS rules. I am focusing on v9.5 for now. I was wondering if this was a problem that I was trying to hide something from a page we navigated to (load the embedded answers page and then click on an answer in hopes to hide the lightning bolt). So, I changed the lookup to be something that loads very early on on a simple page: .bk-home-page on the Home page. Regardless of which custom CSS I try to push (I've tried hiding as well as just changing the background-color with or without !important) it never seems to take effect. Is there some flag that needs to be enabled on the server? Is there something I need to pass with the init to enable this custom CSS feature? Does it matter that I'm using new AppEmbed() and passing specific pageId to tell the SDK which page I want to embed? I feel like I'm not just shooting in the dark with this, I feel like I'm dry-firing a Nerf gun.
shikharTS
shikharTS•3mo ago
Did you try this in the playground as well? I did this in a 9.5 cluster and it worked for me to remove the custom actions icon 
init({
  thoughtSpotHost:
    /*param-start-hosturl*/"url"/*param-end-hosturl*/,
  authType: AuthType.TrustedAuthTokenCookieless,
  getAuthToken: getTokenService,
  disableTokenVerification: true,
  /*param-start-styleCustomization*/
  customizations: {
    style: {

      // To apply overrides for your style sheet in this init, provide variable values below, eg
      customCSS: {
                "rules_UNSTABLE": {
                    ".answer-edit-panel-nav-module__answerConfigPanelNav .answer-edit-panel-nav-module__panelButton [data-testid='action-selector-nav-btn']": {
                        "display":"none"
                    }
                }
            },
    },
  },
/*param-end-styleCustomization*/
});
init({
  thoughtSpotHost:
    /*param-start-hosturl*/"url"/*param-end-hosturl*/,
  authType: AuthType.TrustedAuthTokenCookieless,
  getAuthToken: getTokenService,
  disableTokenVerification: true,
  /*param-start-styleCustomization*/
  customizations: {
    style: {

      // To apply overrides for your style sheet in this init, provide variable values below, eg
      customCSS: {
                "rules_UNSTABLE": {
                    ".answer-edit-panel-nav-module__answerConfigPanelNav .answer-edit-panel-nav-module__panelButton [data-testid='action-selector-nav-btn']": {
                        "display":"none"
                    }
                }
            },
    },
  },
/*param-end-styleCustomization*/
});
No additional flag was needed. Let us know if you are not able to get it to work in the ThoughtSpot cluster playground as well..

Did you find this page helpful?