Code Monkey home page Code Monkey logo

riccox / meilisearch-ui Goto Github PK

View Code? Open in Web Editor NEW
252.0 252.0 36.0 872 KB

😎 An open-source, pretty, simple and fast ⚡ meilisearch admin dashboard UI for managing your meilisearch instances 🕹

Home Page: https://meilisearch-ui.riccox.com

License: Apache License 2.0

HTML 0.19% JavaScript 0.31% TypeScript 97.53% CSS 1.78% Dockerfile 0.20%
admin admin-dashboard admin-panel console dashboard hacktoberfest meilisearch meilisearch-dashboard react reactjs search search-engine searchview typescript ui vercel vitejs

meilisearch-ui's Introduction

Meilisearch-UI

GitHub Workflow Status release stars issues last-commit Docker Image Version (latest semver) Docker Pulls license GitHub deployments

Meilisearch-UI - Pretty, simple and fast meilisearch admin dashboard | Product Hunt

An open-source, pretty, simple and fast meilisearch admin dashboard UI for managing your meilisearch instances

[IMPORTANT] The main branch may be unstable or unavailable during development.

Please use release instead of main branch to obtain a stable version app

Features

🚀 Indexes CRUD

🔎 Search documents

💪 Documents management

🛠️️ Index settings

⚓ Multiple instances management

🔒 Data is stored inside your browser

Quick start

⚠️ This app have not achieved responsive design, so mind that only use this app on desktop to gain better experience.

CORS settings

✅ Remember update CORS settings in your instance server for this ui domain before using.

Because this app use meilisearch official JS client to call your meilisearch instance, you need to manually configure CORS settings in your web server to make sure ui panel can access your instance server with api calls.

Add your ui panel deployment domain to your instance server cors list.

ex:

# ... other configurations
     add_header Access-Control-Allow-Origin "your.meilisearch-ui.domain.com";
# ... other configurations

Learn how to configure CORS settings in your web server

Online use

There is a live demo 👉 meilisearch-ui, deploy on Vercel.

Docker

docker pull riccoxie/meilisearch-ui:latest

docker run -d --restart=always --name="meilisearch-ui" -p <your-port>:24900 riccoxie/meilisearch-ui:latest

Deploy on Vercel

You can deploy this app to the cloud with Vercel

Just one click the button below to deploy this app automatically

Deploy with Vercel

Development

git clone [email protected]:riccox/meilisearch-ui.git

cd meilisearch-ui

pnpm install

pnpm run dev

Built with ♥

  • Sira Design
  • React v18
  • TypeScript
  • Vite
  • ReactRouter v6
  • Mantine
  • Zustand
  • Tailwind CSS
  • ReactErrorBoundary
  • ReactQuery
  • Prettier
  • Fuse.js
  • echarts
  • Lodash.js
  • Immer
  • react-json-view
  • Dayjs

meilisearch-ui's People

Contributors

bangbang93 avatar bidoubiwa avatar riccox avatar rkallenkoot avatar trngtien avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

meilisearch-ui's Issues

Tenant tokens

Is your feature request related to a problem? Please describe.
Support for tenant tokens according to the meili docs

Invalid multi platforms docker image

Describe the bug
Only one platform of docker image is pushed.

To Reproduce
Steps to reproduce the behavior:

  1. Go to https://hub.docker.com/r/riccoxie/meilisearch-ui/tags
  2. See error

Expected behavior
Each image should have multi arch support.

Screenshots
N/A.

Environments (please complete the following information):

  • OS: N/A
  • Browser N/A
  • Version N/A

Additional context
You can refer to docker/build-push-action#846 for more details. According to Multi-platform image with GitHub Actions, if you really want to build multi platform image which utilises job matrix you need to upload all the images as artifacts and then download them and merge them before pushing to Docker Hub.
Otherwise, the old GitHub actions is good to go.

platforms: linux/amd64,linux/arm64,linux/arm/v7

Option to disable automatic refreshes

Is your feature request related to a problem? Please describe.
Connecting to a hosted meilisearch server is costly, so automatic refreshes will increase the cost, especially if you forget the tab open for a long time

Describe the solution you'd like
A toggle to enable/disable automatic refreshes

Visual multi-index search.

Meilisearch already supports multi-index search, but we hope to add a visual page for multi-index search.

Document delete confirm button is not visible in deleting dialog of query results

Describe the bug

  • Delete button translation error in query results list
  • Delete button not visible in deleting dialog of query results

To Reproduce
Steps to reproduce the behavior:

  1. Connect to a meilisearch instance from demo site https://meilisearch-ui.riccox.com/
  2. Select any index which has documents, point to right bottom corner of the list, then actions buttons shown
  3. Delete button shown at prev step was not translate (screenshot 1)
  4. Click the "delete button", then the dialog shown
  5. The confirm button is not visible (screenshot 2)

Expected behavior

  1. delete button traslated
  2. confirm button shown

Screenshots
1

2

Environments (please complete the following information):

  • OS: archlinux
  • Browser chrome
  • Version 119.0.6045.105 (x64)

Additional context
related issue #82

After clicking the settings, the options keep jitter.

Describe the bug

Such as the title

To Reproduce

Download the latest version of the docker image. After starting, click the Settings button, and this problem occurs.

Screenshots

dd

Environments (please complete the following information):

  • OS: MacOS
  • Browser : chrome
  • Version: riccoxie/meilisearch-ui:latest

Doesn't support advanced sorting function like _geoPoint

Describe the bug
When enter a advanced sorting function include comma,its split the sorting function in half and turn into invalid query argument.

To Reproduce
Steps to reproduce the behavior:

  1. Enter _geoPoint(0.0, 0.0):asc into sorting field.

Expected behavior
It should able to recognized the comma in advanced function or have some string escaping feature to deal with its.

Screenshots
image

Environments (please complete the following information):

  • OS: Windows 10
  • Browser Chrome
  • Version Meili 1.5.1

Backspace in filter causes page to crash

I go to the example movies index and put genre=comedy everything works.
Then if I backspace all the way to genre= the page shows an error message and prompts me to refresh.

Or even just typing genr and then hitting backspace can sometimes cause this.

image

Add documents

Is there a way to easily add documents in the UI ?

Disable client side validation on the filter field

Describe the bug
The filter field has many validation bugs while searching, and it doesn't support all the latest changes (like IS NULL, IS EMPTY).
so I suggest disabling the client side validation altogether and leaving only the server-side validation

Screenshots
image
image
image

Environments (please complete the following information):

  • OS: Windows
  • Chrome
  • Version 0.4.0

cc @riccox

How to contribute?

I want to contribute to this source, how can I contribute?

Which standards I have to follow?

Search pictures by pictures

Now Meilisearch has started supporting vector search, and once it stabilizes, it will be used for image search.

Select which server to use based on query url parameter

Describe the bug
Currently the dashboard automatically goes to the last used server, so if I have 2 servers with different index names and reopen the browser tab, it will fail
e.g.

To Reproduce
Assume you have 2 servers

  1. connect to server 1
  2. navigate to any index
  3. open a new tab
  4. connect to server 2
  5. navigate back to the tab with server 1
  6. refresh the page

Expected behavior
The url should refer to the used server, so we should have
/index?server=....&index=IndexOnServer1
and if server is omitted, we use the last connected server

Document/Index delete confirm button is hidden?

Describe the bug
Document/Index delete dialog, confirm button can not be seen. Font color is white and backgroud is transparent/white

To Reproduce

  1. Connect to a meilisearch instance from demo site https://meilisearch-ui.riccox.com/
  2. Go to index settings, then danger zone, click "Delete This Index"
  3. Delete dialog only shows a cancel button, confirm button is rendered but not can not be seen

Expected behavior
show confirm button with a "red" background

Screenshots
image

Environments (please complete the following information):

  • OS: archlinux
  • Browser chrome
  • Version 118.0.5993.70 (x64)

Additional context
nothing

Donation entrance

When I was preparing to donate, I found that I didn’t have a credit card. I recently registered a credit card and couldn’t find the donation entrance.

Not because I have much money, just because I want to use this project, and I want to give the author spiritual encouragement in this way.

It would be great if you could specify functions to reward. If there is an urgently needed function, you can reward development for it.

Instructions for use

There's a few of questions that should be documented

  • How does one configure their instance?
  • How does one set CORS headers for the UI?

@mantine/core: MantineProvider was not found in component tree, make sure you have it in your app

Describe the bug
a Code bug, a package is not installed or something else is missing when accessing the indexes page only.

To Reproduce
run a local version of meilisearch on default settings and this repo on docker too. add the local instance and clikc on indexes.
example compose servics used :

  meilisearch:
    container_name: meilisearch
    image: getmeili/meilisearch:v0.25.2
    environment:
      - http_proxy
      - https_proxy
      - MEILI_MASTER_KEY=${MEILI_MASTER_KEY:-masterKey}
      - MEILI_NO_ANALYTICS=${MEILI_NO_ANALYTICS:-true}
      - MEILI_ENV=${MEILI_ENV:-development}
      - MEILI_LOG_LEVEL
      - MEILI_DB_PATH=${MEILI_DB_PATH:-/data.ms}
    ports:
      - ${MEILI_PORT:-7700}:7700
    volumes:
      - ./data.ms:/data.ms
    restart: unless-stopped

  meilisearch_ui:
    container_name: meilisearch_ui
    image: riccoxie/meilisearch-ui:latest
    ports:
      - "8009:24900"
    restart: unless-stopped

Expected behavior
showing a list fo indexes
Screenshots
image

Environments (please complete the following information):

  • OS: [e.g. iOS] macOs 12.x
  • Browser [e.g. chrome, safari] Chrome 118
  • Version [e.g. 0.0.3] latest from docker hub as of the creation of this post

Additional context
the same issue is visible on the vercel hosted version fo meili search

Invalid DOM property `stroke-width`, should be `strokeWidth`

Describe the bug
The browser console shows warning message:

Invalid DOM property stroke-width

To Reproduce
Steps to reproduce the behavior:

  1. Go to '/ins/1/index/{indexName}'
  2. Switch to console tab, see error

Expected behavior
not show warning

Screenshots
Screenshots

Environments (please complete the following information):

  • OS: macOS
  • Browser: Chrome
  • Version: v0.6.10

Additional context
Two lines are affected:

stroke-width={2}

Ability to set default instance

I would like to integrate meilisearch-ui within the dev env, but I need to setup connection everytime I reset the docker containers.
It would be better if we could pass meilisearch instance configurations via env vars.

The input in the searchForm causes the page to flicker and the input box to lose focus

Describe the bug
I'm not sure if this qualifies as a bug, but the user experience is evidently not great. This issue is present in versions 0.6.9 and 0.6.10; it wasn't present in version 0.6.4.

To Reproduce
Steps to reproduce the behavior:

  1. Go to '/ins/1/index/{indexName}'
  2. Input in 'any of the searchForm's input fields'
  3. See page flicker

Expected behavior
The page doesn't flicker; it only changes the value in the search area

Screenshots

Environments (please complete the following information):

  • OS: macOS m1
  • Browser: Chrome 120.0.6099.129
  • Version: 0.6.9 / 0.6.10

Additional context

Config persistence across restarts

First of all, thank you for a great tool! Exactly what I was looking for

Is your feature request related to a problem? Please describe.

If I restart / lose my container, the configuration of all my instances is gone.

That's why I'd like to persist all my configs in a volume. Is there a way of doing so or the config is not stored on the file system?

Describe the solution you'd like

A path to mount into a docker container to store the configuration files in there

Larger pop-up window for viewing task details

When viewing task details, the pop-up window is too small and you need to slide the scroll bar to view all the information.

Suggest setting the pop-up window size to be larger or providing the function of freely stretching the pop-up window size

image

Document Download

It would be great if JSON files could be downloaded and shared with colleagues for the query files retrieved during troubleshooting

It would be great if you could choose the download field when downloading! Many times, only a portion of the data is needed to handle problems

The sort column error bug

Describe the bug
I have a bug where I use the sort function in indexes and type in, and it displays an app error.
The app needs to be reloaded before it works.

To Reproduce
Steps to reproduce the behavior:

  1. Go to each indexes page
  2. Input everything in the sort column
  3. It would display "app error and undefined reload."

Screenshots
CleanShot 2023-03-31 at 09 51 12

Environments (please complete the following information):

  • OS: MacOS Ventura 13.1
  • Browser: Brave
  • Version: v149.128

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.