Skip to content

AI: Implement a Streams UI easter egg: when the stream search query is "Where is Elky?" (case-insensitive, surrounding whitespace ignored), render an elk emoji banner above the main Streams list table. R#17

Closed
flash1293 wants to merge 1 commit intoflash1293/action-ralphfrom
action-ralph/issue-manual-20260225-143103-19336bdd

Conversation

@flash1293
Copy link
Copy Markdown
Owner

Summary

Prompt: Implement a Streams UI easter egg: when the stream search query is "Where is Elky?" (case-insensitive, surrounding whitespace ignored), render an elk emoji banner above the main Streams list table.

R

Workflow run: https://github.com/flash1293/kibana/actions/runs/22400198219


Changed files

x-pack/platform/plugins/shared/streams_app/public/components/stream_list_view/tree_table.test.tsx
x-pack/platform/plugins/shared/streams_app/public/components/stream_list_view/tree_table.tsx

Final spec state

Expand final spec
## Status

in-progress

## Context

Creating new changes against flash1293/action-ralph. Make file changes locally — a separate publish step handles PR creation.

## Tasks

- [x] Understand the request: Implement a Streams UI easter egg: when the stream search query is "Where is Elky?" (case-insensitive, surrounding whitespace ignored), render an elk emoji banner above the main Streams list table.

Requirements:

1. Implement the behavior in the Streams UI code path used for the main list/table.
2. Add/adjust unit tests to cover:
   - exact phrase match
   - case-insensitive match
   - no banner for other queries
3. Run scoped validations before finishing:
   - at least one relevant Jest test run
   - scoped type check for the touched project
4. In the final spec, include the exact validation commands and whether they passed.

- [x] Plan and expand this into concrete implementation tasks based on what you find. Keep in mind each task runs in a separate agent session with fresh context, so each should be self-contained. Include validation (run tests).
- [ ] Implement the Elky easter egg: Add logic to detect "Where is Elky?" query (case-insensitive, trimmed) in `tree_table.tsx` and render an elk emoji banner above the table when detected. Add unit tests in a new test file `tree_table.test.tsx` to verify: exact match, case-insensitive match, and no banner for other queries. Run Jest tests and scoped lint/type-check for the streams_app project.
- [ ] Final validation: Run full scoped type-check for the touched tsconfig, confirm all tests pass, update spec status to "done".

## Definition of done

All requested changes are implemented, tests pass, and the spec status is set to "done".

## Additional Context

### Code Structure Discovery (Task 1)

**Main Streams List Component:** `/home/runner/work/kibana/kibana/x-pack/platform/plugins/shared/streams_app/public/components/stream_list_view/tree_table.tsx`

- This is the core component that renders the streams table
- Uses `EuiInMemoryTable` with integrated search
- Search query state: `searchQuery` (line 88, type: `Query | undefined`)
- Search handler: `handleQueryChange` (lines 217-219)
- The search query text is accessible via `searchQuery?.text`

**Parent Container:** `/home/runner/work/kibana/kibana/x-pack/platform/plugins/shared/streams_app/public/components/stream_list_view/index.tsx`

- Renders `StreamsTreeTable` component at line 242
- Also renders callouts above the table (lines 234-241): `WelcomeTourCallout` and `LegacyLogsDeprecationCallout`
- Pattern: Callouts are rendered BEFORE the table component

**Search Implementation Details:**

- Search query filtering happens in `tree_table.tsx` lines 177-181
- Free text is extracted from `searchQuery?.text` after removing data quality patterns
- The `searchQuery` object has both `.text` (string) and `.ast` (parsed query structure)

**Test Structure:**

- Existing test file: `utils.test.ts` tests utility functions
- No existing `tree_table.test.tsx` - we'll need to create one
- Test pattern: Jest unit tests using `@testing-library/react` or similar for component testing

**TypeScript Config:**

- Project path: `/home/runner/work/kibana/kibana/x-pack/platform/plugins/shared/streams_app/tsconfig.json`

### Implementation Plan (Task 2)

**Strategy:**

1. In `tree_table.tsx`, add a `useMemo` to detect the easter egg query
2. Render an elk emoji banner (using EUI components) conditionally above the `EuiInMemoryTable`
3. Create `tree_table.test.tsx` with unit tests for:
   - Detection logic (case-insensitive, trimmed)
   - Banner rendering when query matches
   - No banner for other queries
4. Run validation:
   - `yarn test:jest <test-file-path>`
   - `node scripts/eslint.js x-pack/platform/plugins/shared/streams_app/public/components/stream_list_view/tree_table.tsx --fix`
   - `yarn test:type_check --project x-pack/platform/plugins/shared/streams_app/tsconfig.json`

**Easter Egg Detection Logic:**

```typescript
const showElkyBanner = useMemo(() => {
  const query = searchQuery?.text?.trim().toLowerCase() ?? '';
  return query === 'where is elky?';
}, [searchQuery?.text]);

Banner Component:

  • Use EuiCallOut with iconType="🦌" (elk emoji) or similar
  • Place it before the EuiInMemoryTable return statement
  • Keep it simple and fun
</details>

---

> This PR was generated by Action Ralph and is tagged `ai-generated`.
> It **requires manual review and approval** before merging.

cc @flash1293

… is "Where is Elky?" (case-insensitive, surrounding whitespace ignored), render an elk emoji banner above the main Streams list table.

R

Generated by Action Ralph
Files changed: 2
Run: https://github.com/flash1293/kibana/actions/runs/22400198219
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants