update readme, logo, and add screenshots

Signed-off-by: Abhinav Gyawali <22275402+abhizer@users.noreply.github.com>

src/README.md

@@ -1,50 +1,61 @@
-<!-- This README file is going to be the one displayed on the Grafana.com website for your plugin. Uncomment and replace the content here before publishing.
+<h1 align="center">
+  <a href="https://feldera.com">
+    <picture>
+      <source height="125" media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/feldera/docs.feldera.com/refs/heads/main/static/img/logo-color-light.svg">
+      <img height="125" alt="Feldera" src="https://raw.githubusercontent.com/feldera/docs.feldera.com/refs/heads/main/static/img/logo.svg">
+    </picture>
+  </a>
+  <br>
+  <br>
+  <a href="https://opensource.org/licenses/MIT">
+    <img src="https://img.shields.io/badge/License-MIT-green.svg">
+  </a>
+  <a href="https://www.feldera.com/community">
+    <img salt="Slack" src="https://img.shields.io/badge/slack-blue.svg?logo=slack">
+  </a>
+  <a href="https://discord.gg/5YBX9Uw5u7">
+    <img alt="Discord" src="https://img.shields.io/badge/discord-blue.svg?logo=discord&logoColor=white">
+  </a>
+  <a href="https://try.feldera.com/">
+    <img alt="Sandbox" src="https://img.shields.io/badge/feldera_sandbox-blue?logo=CodeSandbox">
+  </a>
+</h1>
 
-Remove any remaining comments before publishing as these may be displayed on Grafana.com -->
-
-# Feldera
-
-<!-- To help maximize the impact of your README and improve usability for users, we propose the following loose structure:
-
-**BEFORE YOU BEGIN**
-- Ensure all links are absolute URLs so that they will work when the README is displayed within Grafana and Grafana.com
-- Be inspired ✨
-  - [grafana-polystat-panel](/~https://github.com/grafana/grafana-polystat-panel)
-  - [volkovlabs-variable-panel](/~https://github.com/volkovlabs/volkovlabs-variable-panel)
-
-**ADD SOME BADGES**
+## Overview / Introduction
+Visualize data from [Feldera](https://feldera.com) in Grafana.
 
-Badges convey useful information at a glance for users whether in the Catalog or viewing the source code. You can use the generator on [Shields.io](https://shields.io/badges/dynamic-json-badge) together with the Grafana.com API
-to create dynamic badges that update automatically when you publish a new version to the marketplace.
+## Requirements
+- A running Feldera pipeline must be accessible to the Grafana instance.
+- The views you intend to query from Grafana must be **MATERIALIZED** views. (See: [Materialized Tables and Views](https://docs.feldera.com/sql/materialized))
 
-- For the URL parameter use `https://grafana.com/api/plugins/your-plugin-id`.
-- Example queries:
-  - Downloads: `$.downloads`
-  - Catalog Version: `$.version`
-  - Grafana Dependency: `$.grafanaDependency`
-  - Signature Type: `$.versionSignatureType`
-- Optionally, for the logo parameter use `grafana`.
+## Getting Started
+1. Install the plugin in your Grafana instance.
+2. Create a data source by specifying:
+   - The URL of the Feldera instance.
+   - The name of the pipeline you intend to query from.
+   - The API Key used to connect to Feldera. Optional.
+3. Start building dashboards and exploring data by querying the **MATERIALIZED VIEWs**. 
+We recommend creating a view for each graph you want to display in Grafana, and then write [ad-hoc queries](https://docs.feldera.com/sql/ad-hoc)
+with this plugin to query these views.
 
-Full example: ![Dynamic JSON Badge](https://img.shields.io/badge/dynamic/json?logo=grafana&query=$.version&url=https://grafana.com/api/plugins/grafana-polystat-panel&label=Marketplace&prefix=v&color=F47A20)
+## Documentation
 
-Consider other [badges](https://shields.io/badges) as you feel appropriate for your project.
+For detailed guidance, visit the [Feldera Documentation](https://docs.feldera.com/).
 
-## Overview / Introduction
-Provide one or more paragraphs as an introduction to your plugin to help users understand why they should use it.
+### Suppported Macros
 
-Consider including screenshots:
-- in [plugin.json](https://grafana.com/developers/plugin-tools/reference/plugin-json#info) include them as relative links.
-- in the README ensure they are absolute URLs.
+| Macro           | Description                                                   |
+|-----------------|---------------------------------------------------------------|
+| `$__timeFrom()` | Replaced by the start time specified by Grafana time picker.  |
+| `$__timeTo()`   | Replaced by the end time specified by Grafna time picker.     |
 
-## Requirements
-List any requirements or dependencies they may need to run the plugin.
+*Note that Feldera's `TIMESTAMP` type doesn't store time zone information.*
 
-## Getting Started
-Provide a quick start on how to configure and use the plugin.
+### Time Series Graphs
 
-## Documentation
-If your project has dedicated documentation available for users, provide links here. For help in following Grafana's style recommendations for technical documentation, refer to our [Writer's Toolkit](https://grafana.com/docs/writers-toolkit/).
+To create time series graphs, add a *Convert field type* transformation and specify the timestamp column in your data as type **TIME**.
 
 ## Contributing
-Do you want folks to contribute to the plugin or provide feedback through specific means? If so, tell them how!
--->
+This plugin's repository is hosted on Github: [Feldera Grafana Datasource](/~https://github.com/feldera/grafana-datasource).
+We welcome contributions and feature requests.
+

src/plugin.json

@@ -7,17 +7,35 @@
   "backend": true,
   "executable": "gpx_feldera",
   "info": {
-    "description": "",
+    "description": "A grafana data source plugin for Feldera.",
     "author": {
       "name": "Feldera"
     },
-    "keywords": ["datasource"],
+    "keywords": ["feldera", "datasource"],
     "logos": {
       "small": "img/logo.svg",
       "large": "img/logo.svg"
     },
-    "links": [],
-    "screenshots": [],
+    "links": [
+      {
+        "name": "Website",
+        "url": "https://feldera.com"
+      },
+      {
+        "name": "Github",
+        "url": "/~https://github.com/feldera/feldera-feldera-datasource"
+      }
+    ],
+    "screenshots": [
+      {
+        "name": "query_editor",
+        "path": "img/query_editor.png"
+      },
+      {
+        "name": "config_editor",
+        "path": "img/config_editor.png"
+      }
+    ],
     "version": "%VERSION%",
     "updated": "%TODAY%"
   },