fix: Incorrect tag filtering when results have no features (#3309)

frontend/web/components/pages/FeaturesPage.js

@@ -30,6 +30,7 @@ const FeaturesPage = class extends Component {
   constructor(props, context) {
     super(props, context)
     this.state = {
+      loadedOnce: false,
       search: null,
       showArchived: false,
       sort: { label: 'Name', sortBy: 'name', sortOrder: 'asc' },
@@ -61,6 +62,7 @@ const FeaturesPage = class extends Component {
       params.environmentId !== oldParams.environmentId ||
       params.projectId !== oldParams.projectId
     ) {
+      this.state.loadedOnce = false
       AppActions.getFeatures(
         params.projectId,
         params.environmentId,
@@ -181,16 +183,19 @@ const FeaturesPage = class extends Component {
               totalFeatures,
               maxFeaturesAllowed,
             )
+            if (projectFlags?.length && !this.state.loadedOnce) {
+              this.state.loadedOnce = true
+            }
             return (
               <div className='features-page'>
                 {isLoading && (!projectFlags || !projectFlags.length) && (
                   <div className='centered-container'>
                     <Loader />
                   </div>
                 )}
-                {(!isLoading || (projectFlags && !!projectFlags.length)) && (
+                {(!isLoading || this.state.loadedOnce) && (
                   <div>
-                    {(projectFlags && projectFlags.length) ||
+                    {this.state.loadedOnce ||
                     ((this.state.showArchived ||
                       typeof this.state.search === 'string' ||
                       !!this.state.tags.length) &&
@@ -205,7 +210,7 @@ const FeaturesPage = class extends Component {
                           title={'Features'}
                           cta={
                             <>
-                              {(projectFlags && projectFlags.length) ||
+                              {this.state.loadedOnce ||
                               this.state.showArchived ||
                               this.state.tags?.length
                                 ? this.createFeaturePermission((perm) => (
@@ -483,9 +488,7 @@ const FeaturesPage = class extends Component {
                             title='2: Initialising your project'
                             snippets={Constants.codeHelp.INIT(
                               this.props.match.params.environmentId,
-                              projectFlags &&
-                                projectFlags[0] &&
-                                projectFlags[0].name,
+                              projectFlags?.[0]?.name,
                             )}
                           />
                         </FormGroup>