Merge pull request #353 from prabushi/master2

Fix sample listing when no search results found
ballerina-attic · Apr 5, 2021 · 4a5174d · 4a5174d
2 parents 5aaa5ad + 34c96fc
commit 4a5174d
Showing 1 changed file with 28 additions and 14 deletions.
diff --git a/composer/packages/bbe/src/ExampleList.tsx b/composer/packages/bbe/src/ExampleList.tsx
@@ -23,6 +23,7 @@ import { BallerinaExampleCategory } from "./model";
 export interface SamplesListState {
     samples?: BallerinaExampleCategory[];
     searchQuery?: string;
+    noSearchReults?: boolean;
 }
 
 export interface SamplesListProps {
@@ -55,6 +56,16 @@ export class SamplesList extends React.Component<SamplesListProps, SamplesListSt
                     }
                     return sampleCategory.samples.length !== 0;
                 });
+                if (samples.length === 0) {
+                    samples = cloneDeep(this.availableSamples);
+                    this.setState({
+                        noSearchReults: true
+                    });
+                } else {
+                    this.setState({
+                        noSearchReults: false
+                    });
+                }
                 this.setState({
                     samples,
                 });
@@ -106,20 +117,20 @@ export class SamplesList extends React.Component<SamplesListProps, SamplesListSt
                 <List.Item>
                     <List.Header>{column.title}</List.Header>
                     <List animated verticalAlign="middle">
-                    {
-                        column.samples.map((sample) => {
-                            return (
-                            <List.Item className="example" key={sample.url}>
-                                <a
-                                    href="#"
-                                    onClick={
-                                        () => this.props.openSample(sample.url)}
-                                >
-                                    {sample.name}
-                                </a>
-                            </List.Item>);
-                        })
-                    }
+                        {
+                            column.samples.map((sample) => {
+                                return (
+                                    <List.Item className="example" key={sample.url}>
+                                        <a
+                                            href="#"
+                                            onClick={
+                                                () => this.props.openSample(sample.url)}
+                                        >
+                                            {sample.name}
+                                        </a>
+                                    </List.Item>);
+                            })
+                        }
                     </List>
                 </List.Item>
             </List>
@@ -134,6 +145,9 @@ export class SamplesList extends React.Component<SamplesListProps, SamplesListSt
                         <Header as="h3" dividing>
                             Ballerina Examples
                         </Header>
+                        {this.state && this.state.noSearchReults ?
+                            (<>No search results found!</>) : null
+                        }
                         {this.state && this.state.samples && this.state.samples.length > 0 ?
                             (
                                 <Form>