ChartJS bar chart - text over bar? [duplicate]

I am using Chart JS in React. I want to do this:

I currently have this:

This is my code:

export const options = {
  responsive: true,
  indexAxis: 'y',
  plugins: {
    legend: {
      display: false,
    },
    title: {
      display: false,
    },
  },
  hover: {
    mode: null,
  },
};

const labels = [
  'introduction',
  'html css',
  'version control',
  'advanced',
  'intro js',
  'advanced',
  'intro to react',
];

export const data = {
  labels,
  datasets: [
    {
      data: chartMock.map((item) => item.percentage),
      backgroundColor: chartMock.map((item) => getBarColor(item.percentage)),
    },
  ],
};

const BarChart = () => {
  return <Bar options={options} data={data} />;
};

Is it possible to put text over the bar, as in example? Also, how can i remove padding around each row?

I already tried associated answer, but nothing happens. I saw that chartjs-plugin-datalabels are something that could help me, but nothing that I tried worked.